타이포그래피
프로젝트 폰트 정보
폰트
Pretendard Variable
한글
가나다라마바사
Geist Sans
영문
The quick brown fox
Geist Mono
코드
const name = "Bada";
폰트 크기 스케일
| Class | 크기 | 예시 |
|---|---|---|
| text-xs | 0.75rem (12px) | 작은 텍스트 |
| text-sm | 0.875rem (14px) | 작은 텍스트 |
| text-base | 1rem (16px) | 기본 텍스트 |
| text-lg | 1.125rem (18px) | 큰 텍스트 |
| text-xl | 1.25rem (20px) | 제목 |
| text-2xl | 1.5rem (24px) | 중간 제목 |
| text-3xl | 1.875rem (30px) | 큰 제목 |
| text-5xl | 3rem (48px) | 페이지 제목 |
폰트 굵기
Font Normal (400)
Font Medium (500)
Font Semibold (600)
Font Bold (700)
사용 예시
// Tailwind 클래스 <h1 className="text-5xl font-bold">페이지 제목</h1> <h2 className="text-3xl font-semibold">섹션 제목</h2> <p className="text-base text-muted-foreground">본문 텍스트</p> <span className="text-sm">작은 텍스트</span>