Design Tokens(DOM解析データ)
このサイトを 1440×900 でレンダリングして、実際のCSS値から自動抽出した数値データです。「同じ感じ」を再現する材料になります。
カラーロール
Background
#ffffffText
oklch(0.2 0 0)Color #1
#1a1714Color #2
oklch(0.2 0 0)Color #3
#5a544cColor #4
oklch(0.42 0 0)Color #5
oklch(0.96 0.005 80)タイポグラフィ
| 要素 | Font | Size | Weight | Line | Tracking |
|---|---|---|---|---|---|
| h1 | Inter |
74.88px | 600 | 74.88px | -2.9952px |
| h2 | Inter |
56px | 600 | 58.24px | -1.68px |
| h3 | Inter |
24px | 600 | 28.8px | -0.48px |
| 本文 | Inter Tight |
11px | 600 | normal | 1.54px |
| リンク | Inter Tight |
14px | 600 | normal | normal |
| ボタン | Inter Tight |
15px | 600 | normal | normal |
使用フォント頻度
Inter Tight471箇所
Inter21箇所
IBM Plex Mono11箇所
Arial6箇所
スケール・形状
- 角丸スケール
- 8px / 4px / 10px / 0px 12px 12px 0px / 16px / 16px 16px 5px / 16px 16px 16px 5px / 22%
- シャドウ
- 5パターン使用
- セクション余白(pt/pb)
- 192-280px / 96-96px / 88-88px / 112-112px / 112-112px
- コンテナ幅
- width: 1200px / max-width: 1200px
- ナビゲーション
- 高さ 64px / position: sticky