Width
12 カラムのグリッドシステムに基づく幅トークン。Container / Dialog / Component / Column の 4 カテゴリ。
トークン一覧
12カラムのグリッドシステムに基づくレイアウト用トークン。基準解像度1920px、1rem=16px。利用可能コンテンツ幅 = 1920 - (4rem*2) = 1792px。基本カラム幅 = (1792 - 2rem*(12-1)) / 12 = 120px。カラムN = 120*N + 32*(N-1)。
Container
- container.narrow1184px
- container.default1336px
- container.wide1488px
Dialog
- dialog.s424px
- dialog.m728px
- dialog.l1184px
Component
- component.xs80px
- component.s160px
- component.m320px
- component.l480px
- component.xl640px
Column (12 グリッド)
- col.1120px
- col.2272px
- col.3424px
- col.4576px
- col.5728px
- col.6880px
- col.71032px
- col.81184px
- col.91336px
- col.101488px
- col.111640px
- col.121792px