PackagesUIToken Reference Typography
タイポグラフィトークンのリファレンス。
ベースサイズは 16px(1rem)。行間は Tailwind の text-* に含まれるため、個別指定は不要。
| Tailwind | サイズ | 行間 | 主な用途 |
|---|
text-xs | 12px | 1.5 | キャプション、バッジ、タイムスタンプ |
text-sm | 14px | 1.5 | 補助テキスト、テーブルセル |
text-base | 16px | 1.75 | 本文テキスト、フォーム入力 |
text-lg | 18px | 1.5 | セクション見出し |
text-xl | 20px | 1.4 | ページ内見出し |
text-2xl | 24px | 1.33 | ページタイトル |
| Tailwind | 値 | 主な用途 |
|---|
font-normal | 400 | 本文テキスト、フォーム入力 |
font-medium | 500 | テーブルヘッダー、ラベル、ボタン |
font-bold | 700 | 見出し、強調 |
| 用途 | Tailwind クラス |
|---|
| ページタイトル(h1) | text-2xl font-bold |
| ページ内見出し(h2) | text-xl font-bold |
| セクション見出し(h3) | text-lg font-bold |
| 本文 | text-base font-normal |
| 補助テキスト | text-sm font-normal |
| キャプション | text-xs font-normal |
| フォームラベル | text-sm font-medium |
| ボタン | text-sm font-medium |
| Tailwind | 用途 |
|---|
font-sans | 本文・UI全般(デフォルト) |
font-mono | コード・数値 |