본문 바로가기

Foundations

Typography (타이포그래피)

한글 본문은 Pretendard, 숫자·라틴은 Plus Jakarta Sans. 본문 좌측 정렬 · word-break: keep-all · 양끝맞춤 금지. 상세 한글 규칙(띄어쓰기·줄바꿈)은 발행 전 체크리스트와 함께 korean-typography 가이드가 정본이다.

타입 스케일

스타일토큰크기/행간/굵기실물
display--text-display60px / 1.12 / 900안전한 거리 132m
h1--text-h148px / 1.12 / 900안전한 거리 132m
h2--text-h236px / 1.22 / 800안전한 거리 132m
h3--text-h330px / 1.22 / 800안전한 거리 132m
h4--text-h424px / 1.22 / 700안전한 거리 132m
title--text-title20px / 1.5 / 700안전한 거리 132m
body-lg--text-body-lg18px / 1.65 / 400안전한 거리 132m
body--text-body16px / 1.65 / 400안전한 거리 132m
body-sm--text-body-sm14px / 1.5 / 400안전한 거리 132m
label--text-label14px / 1.5 / 600안전한 거리 132m
caption--text-caption12px / 1.5 / 500안전한 거리 132m
eyebrow--text-eyebrow12px / 1.5 / 800안전한 거리 132m

사용 규칙

  • 제목은 --font-ls-tighter 자간 + text-wrap: balance, 본문 행간은 1.65(--font-lh-relaxed).
  • 숫자 표·금액은 font-variant-numeric: tabular-nums로 자릿수를 정렬한다.
  • 스케일 밖 크기를 임의로 만들지 않는다 — 12단계로 부족하면 설계를 의심한다.