큐레이션 · 오픈 · 무료

Yuga

거대한 타이포그래피에 기반한 고대비 브루탈리스트 디지털 존재감.

01

디자인 DNA

절대적 어둠에서 조각된 거대한 디지털 존재.

02

컬러

엄격한 흑백 기반의 절대적 이진 대비.

03

타이포그래피

grotesque-sans

• display102px · 800
• heading52px · 800
• body14px · 400

대형 디스플레이 텍스트에는 극도로 좁은 트래킹을 사용합니다. · 구조적 위계를 위해 무거운 두께를 유지합니다. · 대비를 위해 본문 텍스트는 작고 조밀하게 유지합니다.

04

여백

엄격한 4px 그리드와 좁은 수직 간격입니다.

05

표면 (라운드 / 그림자 / 경계선)

구조적 분리를 위한 얇고 고대비 테두리입니다.

06

레이아웃

거대한 타이포그래피 앵커를 갖춘 넓은 어두운 캔버스입니다.

07

모션과 인터랙션

매끄러운 불투명도 페이드 · 변환 가능한 구조적 변화

색상이나 불투명도 변화를 통한 시각적 상태 전환. · 즉각적인 구조적 피드백.

08

컴포넌트

• button 극도로 둥근 고대비 알약 형태입니다.
• card 최소한의 패딩을 갖춘 매끄럽고 어두운 표면입니다.
• chip 분류를 위한 작고 알약 모양의 태그입니다.
• input 데이터 입력을 위한 깔끔하고 테두리가 있는 필드입니다.
• hero 거대한 타이포그래피와 중앙 로고를 갖춘 전체 화면 블랙 보이드입니다.

09

보이스와 금지 목록

• 톤 단호하고 직접적이며 타협하지 않는 어조.
• 헤드라인 거대한 글씨체로 짧고 임팩트 있는 문장.
• CTA 간결하고 행동 지향적.

• 대비를 줄이는 그레이를 사용하지 마세요 — 스크린샷은 대신 절대적인 블랙(#000000)과 화이트(#FFFFFF)를 보여줍니다
• 세리프 서체를 사용하지 마세요 — 스크린샷은 대신 무거운 기록산스(AK Monument Grotesk)를 보여줍니다
• 작은 디스플레이 크기를 사용하지 마세요 — 스크린샷은 대신 거대한 102px 헤더를 보여줍니다
• 넓은 트래킹을 사용하지 마세요 — 스크린샷은 대신 좁은 음수 자간(-4.8px)을 보여줍니다
• 카드에 둥근 모서리를 사용하지 마세요 — 스크린샷은 대신 날카로운 모서리를 보여줍니다
• 미묘한 그래디언트를 사용하지 마세요 — 스크린샷은 대신 평평하고 고대비 블록을 보여줍니다
• 피하기: 친근하거나 캐주얼한 언어
• 피하기: 장식적이고 과도한 요소
• 피하기: 망설이거나 모호한 표현

10

팩 안의 실제 스크린샷

실제 페이지에서 캡처 · 실 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko