mochacare.com ↗
サイトを開く
Care operations, on autopilot.
Design Tokens（DOM解析データ）
このサイトを 1440×900 でレンダリングして、実際のCSS値から自動抽出した数値データです。「同じ感じ」を再現する材料になります。
カラーロール
Background
#fdfbf7Text
#3e2b26Color #1
#3e2b26Color #2
#ffffffColor #3
#8d6e63Color #4
lab(65.9269 -0.832707 -8.17473)Color #5
lab(30.2606 12.0629 10.8266 / 0.6)タイポグラフィ
| 要素 | Font | Size | Weight | Line | Tracking |
|---|---|---|---|---|---|
| h1 | Instrument Serif |
72px | 400 | 79.2px | -1.8px |
| h2 | Instrument Serif |
36px | 400 | 40px | normal |
| h3 | Instrument Serif |
36px | 400 | 40px | normal |
| 本文 | Plus Jakarta Sans |
18px | 400 | 28px | normal |
| リンク | Plus Jakarta Sans |
16px | 400 | 24px | normal |
| ボタン | Plus Jakarta Sans |
15px | 600 | 22.5px | normal |
使用フォント頻度
Plus Jakarta Sans329箇所
Instrument Serif15箇所
Caveat1箇所
スケール・形状
- 角丸スケール
- 14px / 3.35544e+07px / 18px / 50% / 32px / 22px / 40px / 10px
- シャドウ
- 5パターン使用
- セクション余白(pt/pb)
- 24-80px / 80-80px / 64-64px / 64-64px / 64-64px
- コンテナ幅
- width: 1440px / max-width: none
- ナビゲーション
- 高さ 88px / position: fixed
