Prismatic Dark Diagram Deck

# 프리즈매틱 다크 다이어그램 — ppt 디자인 팩

아래 지시를 한 블록으로 따라 16:9(13.33×7.5in) 슬라이드 덱을 만든다. 프리즈매틱 다크 — 잉크 네이비-블랙 배경 위 다이어그램 노드·라인이 멀티컬러 프리즘 그라디언트(시안→마젠타→앰버)로 발광하는 테크 컨퍼런스 키노트형 다이어그램 키트.

## 이 스타일의 정체성
한눈에 알아보는 단서: (1) 잉크 네이비-블랙 배경에 다이어그램 노드는 채움이 거의 투명하고 1px 프리즘 그라디언트 스트로크 윤곽선만 있다, (2) 커넥터 라인이 시안→마젠타→앰버 그라디언트로 발광하며 끝에 빛 점이 맺힌다, (3) 미디엄 산세리프 + 작은 등폭 라벨. 노드는 칠해진 카드가 아니라 빛으로 그린 윤곽이다.

## 색
- 배경 `#0B0E1A` (잉크 네이비-블랙), 깊이용 보조 면 `#11152400` ~ `#141A2E` (거의 차이 없음)
- 글래스 패널 면: `#141A2E` 60% 알파
- 본문 텍스트 `#E8EAF0`, 보조 `#8A90A6`
- 프리즘 그라디언트(stroke·발광 전용): 시안 `#22D3EE` → 마젠타 `#D946EF` → 앰버 `#FBBF24`. 이 3 스톱이 모든 노드 보더·커넥터·차트 라인의 그라디언트.
- 단색 강조(단일 톤 필요 시): 시안 `#22D3EE`
- 격자선·헤어라인: `#1E2336` (어두운)
- 강조색은 프리즘 그라디언트 1세트뿐. 발광 색을 무지개로 늘리지 않는다.

## 타이포그래피
- 폰트: `Inter`(본문·디스플레이, 대체 `Arial`), 라벨·수치 `JetBrains Mono`(대체 `Consolas`). 한글은 `Pretendard`.
- 슬라이드 타이틀: 30pt / Inter 600 / 자간 -1%
- 키커/오버라인: 12pt / JetBrains Mono 500 / 자간 +8% / 대문자 / 색 시안 `#22D3EE`
- KPI 대형 수치: 48pt / Inter 700 / 프리즘 그라디언트 텍스트 채움
- 다이어그램 노드 번호·라벨: 13pt / JetBrains Mono 500
- 본문: 18pt / Inter 400 / 행간 1.4 / 슬라이드당 6줄 이하
- 캡션·축 레이블: 11pt / JetBrains Mono 400 / 색 `#8A90A6`

## 레이아웃 / 그리드
- **풀블리드.** 배경 잉크 네이비-블랙이 가장자리까지. 좌우 여백 0.7in, 상하 0.55in(콘텐츠 안전 영역).
- 12열 그리드. 다이어그램은 슬라이드 중앙~우측 넓은 영역, 텍스트는 좌측 정렬.
- 한 슬라이드 핵심 메시지 1개. 발광 다이어그램 1개 + 보조 텍스트.

## 형태 / 질감
- 노드: 채움 `#141A2E` 20% 알파(거의 투명) + 1px 프리즘 그라디언트 스트로크. 모서리 반경 8px(캡슐형은 풀라운드).
- 글래스 패널: `#141A2E` 60% 알파 + 1px 그라디언트 헤어라인 보더 + 약한 외부 글로우(blur 8px, 그라디언트색 25% 알파).
- 발광: 라인·노드에 outer glow(blur 6~10px, 동일 그라디언트 25% 알파). 텍스트엔 글로우 금지(가독성).
- 그림자·베벨 금지. 빛은 글로우로만 표현.

## 차트·데이터 시각화 (발광 그라디언트 차트 — 정밀도 우선)
차트는 SVG로 정밀 렌더한다(div 블록 막대 금지). 발광이 차트 정밀도를 해치면 안 된다 — 데이터 라인 글로우는 약하게, 값 라벨은 또렷하게.
- **데이터 색:** 라인·면적·막대는 프리즘 그라디언트(시안→마젠타→앰버) 또는 단색 시안 `#22D3EE`. 단일 계열이면 시안 단색, 강조할 막대 1개만 그라디언트 채움. 다계열은 시안/마젠타/앰버 3색(4계열 이상 금지). 증가=시안, 감소=`#F87171`(차트 한정 경고).
- **발광 제어:** 데이터 라인 글로우는 blur 4px·그라디언트 20% 알파로 **약하게**. 값 라벨·축 라벨에는 글로우 금지.
- **데이터 잉크 최소화:** 격자선은 y축 주요 눈금 0.5pt `#1E2336` **2~3개만**(0·중간·최댓값). 차트 테두리 박스·플롯 배경 채움 제거. x축 베이스라인만 0.75pt `#1E2336`.
- **값 레이블:** 막대 끝/꼭짓점/도넛 조각에 직접 표기. `JetBrains Mono` 13pt 500, 색 `#E8EAF0`(밝게), 탭형 정렬, 단위·자릿수 일관. 카테고리명 막대 아래 11pt `#8A90A6`. 범례 박스 금지 — 계열명은 차트 상단 0.08in 색 점 + 11pt 라벨 인라인.
- **막대 형태:** 막대 폭 : 간격 = 3 : 2, 모서리 반경 2px, 윗면 0.04in에 밝은 그라디언트 글로우 캡(나머지 막대는 그라디언트 35% 알파 채움). 베이스라인 0에서 정확히(잘린 y축 금지).
- **차트 타입 매칭:** 비교=세로/가로 막대(윗면 글로우), 추세=발광 그라디언트 폴리라인(2pt) + 페이드 면적(그라디언트 18%→0% 알파), 비중=도넛(조각 3개 이하, 그라디언트 아크, 중앙 핵심 수치 28pt + 라벨 11pt). 파이·3D·다중 도넛 금지.
- **출처:** 차트 하단 좌측 11pt JetBrains Mono `#8A90A6` 출처·단위 캡션 의무.

## 다이어그램·컴포넌트 (프리즘 발광 라인 다이어그램 키트)
색만으로는 템플릿이 아니다. 아래 컴포넌트를 모두 SVG로 정밀 렌더하며(div 블록 금지) **하나의 다이어그램 언어**를 공유한다 — 모든 노드는 채움 거의 투명(`#141A2E` 20% 알파) + 1px 프리즘 그라디언트 스트로크 윤곽선(모서리 8px), 커넥터는 발광 그라디언트 라인(1.5pt + blur 5px 글로우) + 끝 빛 점, 번호는 JetBrains Mono 13pt 캡슐 안, 강조는 보더 글로우 강화(blur 4px→10px).
- **프로세스 플로우:** 가로 4~6단계, 각 노드 = 투명 채움 캡슐(높이 0.8in, 풀라운드, 1px 프리즘 보더), 노드 사이 발광 그라디언트 라인 커넥터(좌→우 색 전이) + 끝에 0.06in 빛 점. 단계 번호는 노드 좌단 캡슐 안 등폭 13pt. 활성 단계만 보더 글로우 강화.
- **타임라인:** 수평 그라디언트 빔(높이 3px, 좌 시안→우 앰버 색 전이 + blur 6px 글로우), 마일스톤은 빔 위 0.18in 발광 노드(투명 채움 + 그라디언트 보더 + 글로우), 현재 시점은 노드 글로우 강화 + 위에 12pt 시안 키커 "NOW". 날짜 빔 아래 11pt 등폭 `#8A90A6`.
- **비교 레이아웃:** 2~3 글래스 패널(`#141A2E` 60% 알파 + 1px 그라디언트 헤어라인 보더), 추천 패널만 보더 글로우(blur 10px). 패널 상단 12pt 등폭 대문자 키커, 행은 0.5pt `#1E2336` 헤어라인 구획. 우세 항목은 시안 텍스트.
- **매트릭스 2×2:** 1px 그라디언트 십자 축(blur 4px 약한 글로우), 4축 끝 11pt 등폭 `#8A90A6` 라벨. 데이터 포인트는 발광 도트(0.16~0.32in, 채움 그라디언트, 밝기=값 — 큰 값일수록 글로우 강하게). 사분면 채움 없음.
- **계층/퍼널:** 적층 캡슐 — 위→아래 폭 좁아지는 4~5단(투명 채움 캡슐, 1px 프리즘 보더, 그라디언트 색 위치를 단마다 이동시켜 시안→앰버 전이), 각 단 우측 13pt 등폭 라벨 + 48pt 그라디언트 텍스트 수치.
- **KPI·스탯 카드:** 다크 글래스 카드(`#141A2E` 60% 알파 + 1px 그라디언트 헤어라인 보더, 8px 모서리), 좌상단 12pt 등폭 대문자 헤더, 48pt Inter 700 프리즘 그라디언트 텍스트 채움 KPI 수치, 옆에 13pt 델타(시안 ▲/`#F87171` ▼), 우하단 도넛 진행 링(그라디언트 아크, 트랙 `#1E2336`).
- **목차/섹션 디바이더/인용:** 목차는 등폭 번호(01·02…, 시안) + 18pt 항목명 + 우측 발광 그라디언트 진행 바. 디바이더는 풀블리드 잉크 네이비 + 중앙 거대 그라디언트 텍스트 섹션 번호 120pt + 30pt 섹션명, 배경에 약한 그라디언트 라인 모티프. 인용은 좌측 0.18in 그라디언트 발광 바 + 28pt Inter 풀쿼트 `#E8EAF0`.

## 전환 (PPT)
0.3s 페이드 + 발광 요소 0.25s 글로우 페이드인. 커넥터 라인은 좌→우 0.3s 드로우 빌드 허용(스냅한 페이싱).

## 하지 말 것
- 노드를 솔리드 색으로 채우기 — 채움은 거의 투명, 빛(스트로크·글로우)으로 그린다.
- 발광 색을 4색 이상 무지개로 늘리기 — 프리즘은 시안·마젠타·앰버 3스톱 1세트뿐.
- 텍스트·값 라벨에 글로우/블러 — 가독성 파괴. 글로우는 노드 보더·커넥터·차트 라인에만.
- 그림자·베벨·입체 효과. 빛은 글로우로만.
- 데이터 라인 글로우를 강하게 — blur 4px·20% 알파로 약하게(정밀도 우선).
- 모든 슬라이드 중앙 정렬, 균일 레이아웃 반복.
- 차트 회귀: 3D 차트, 무지개 계열 색칠, 격자선 과다, 범례 박스, 잘린 y축, 파이/다중 도넛.
- 이모지 불릿·클립아트.

## 적용 예
- **표지:** 풀블리드 잉크 네이비, 배경에 약한 그라디언트 라인 모티프, 중앙 좌측 30pt 타이틀 + 12pt 시안 등폭 키커, 우측에 발광 프리즘 노드 다이어그램 한 점.
- **본문 슬라이드:** 좌측 18pt 본문 4줄 + 12pt 키커, 우측에 4단계 발광 프로세스 플로우(투명 캡슐 + 그라디언트 커넥터).
- **차트 슬라이드:** 좌측 큰 발광 그라디언트 추세 라인 차트(2pt 라인·blur 4px 약한 글로우·페이드 면적·격자선 2~3개·13pt 등폭 값 라벨), 우측 도넛(조각 3개 그라디언트 아크·중앙 28pt 수치) + 11pt 출처.
- **타임라인 슬라이드:** 수평 그라디언트 빔(시안→앰버 전이 + 글로우), 발광 노드 마일스톤 5개, 현재 시점 글로우 강화 + "NOW" 키커.
- **매트릭스 슬라이드:** 1px 그라디언트 십자 축, 발광 도트 6개(밝기=값), 4축 끝 등폭 라벨.
- **KPI 슬라이드:** 다크 글래스 카드 4개 그리드 — 각 48pt 그라디언트 텍스트 수치 + 13pt 델타 + 도넛 진행 링.