YouShift PC表示
YouShift タブレット表示
YouShift スマホ表示

Shift scheduling made easy

Design Tokens(DOM解析データ)

このサイトを 1440×900 でレンダリングして、実際のCSS値から自動抽出した数値データです。「同じ感じ」を再現する材料になります。

カラーロール

Background#ffffff
Text#000000
Color #1#000000
Color #2oklch(0.37 0.013 285.805)
Color #3oklch(0.552 0.016 285.938)
Color #4oklch(0.21 0.006 285.885)
Color #5#ffffff

タイポグラフィ

要素FontSizeWeightLineTracking
h1 Inter Variable 60px 700 66px -1.5px
h2 Inter Variable 48px 700 48px -1.2px
h3 Inter Variable 18px 700 28px normal
本文 Inter Variable 14px 400 24px normal
リンク Inter Variable 16px 400 24px normal
ボタン Inter Variable 16px 400 24px normal

使用フォント頻度

Inter Variable583箇所

スケール・形状

角丸スケール
10px / 12px / 16px / 20px / 9999px / 4px 4px 0px 0px / 24px / 8px
シャドウ
5パターン使用
セクション余白(pt/pb)
96-96px / 96-96px / 96-96px / 96-96px / 128-128px
コンテナ幅
width: 1440px / max-width: none
ナビゲーション
高さ 88px / position: sticky

関連サイト