design_values.cssdesign_values.jsonpage-skeleton.html
Grid.
12 columns on wide layouts, 4 at 760px and below. Resize the window to see it switch.
01
02
03
04
05
06
07
08
09
10
11
12
| Token | Value |
|---|---|
--grid-columns | 12 |
--grid-compactColumns | 4 |
--grid-maxWidth | 1200px |
--grid-gutter | 24px |
--grid-compactGutter | 16px |
--grid-pageMargin | 48px |
--grid-compactPageMargin | 24px |
--grid-artworkModule | 60px |
Spacing.
--space-14px--space-28px--space-312px--space-416px--space-524px--space-632px--space-748px--space-864px--space-996pxRadius.
--radius-default0px--radius-control4px--radius-maximum8pxBreakpoints.
| Token | Max width |
|---|---|
compactMax | 760px |
mediumMax | 1100px |
Rules only. Compact layout at <=760px; medium layout from 761px to 1100px; wide layout above 1100px. Use label/body sizes unchanged across breakpoints; display changes from 50px to 36px. Radius 0 is the default; 4px controls and 8px maximum are implementation limits. No components are supplied.