글자 개요
좋은 타이포그래피는 색이나 장식이 아니라 크기 · 굵기 · 행간 · 자간, 이 네 가지 수치의 조합에서 나옵니다. 이 네 가지만 제대로 다뤄도 텍스트의 위계와 가독성이 눈에 띄게 좋아집니다.
네 가지 핵심 속성
| 속성 | 역할 | Framer 패널 위치 |
|---|---|---|
| 크기 (Size) | 위계(제목·본문·캡션 구분) | Text → Size |
| 굵기 (Weight) | 강조, 위계 보조 | Text → Weight |
| 행간 (Line height) | 문단 가독성 | Text → Line height |
| 자간 (Letter spacing) | 글자 밀도, 인상 | Text → Letter spacing |
반응형 지정 — 네 속성 모두 Desktop·Tablet·Phone 브레이크포인트마다 다르게 지정할 수 있습니다. 특히 제목 크기는 모바일에서 데스크톱보다 작게 주는 것이 일반적입니다.
왜 색보다 크기·굵기가 먼저인가
컬러로 강조를 표현하면 브랜드 컬러가 바뀔 때마다 위계가 흔들립니다. 반대로 크기·굵기로 위계를 잡아두면 컬러를 바꿔도 구조가 그대로 유지됩니다. 이 위키도 포인트 컬러 없이 블랙·화이트·그레이 모노톤만 쓰는데, 제목을 크고 굵게, 본문을 작고 가늘게 하는 것만으로 위계가 분명하게 읽힙니다.
이 카테고리에서 다루는 것
- 크기 (Size) — 위계를 만드는 가장 강력한 도구, 텍스트 박스 크기와의 차이
- 굵기 (Weight) — 100~900 굵기 체계, 가변 폰트 커스텀 굵기
- 행간 (Line Height) — 한글 문단 가독성의 핵심
- 자간 (Letter Spacing) — 타이트하고 정돈된 인상 만들기
다음 단계
크기 (Size)부터 시작하세요.
자주 묻는 질문
Last updated on