Light
Primitives
Mode 1
26 tokens
1 error
error · default mode name
. Show in lint
Colors.
Foundation.
Blue.
500
#0057b8
Colors.
Foundation.
Blue.
700
#003f8a
Colors.
Foundation.
Navy.
500
#3d5a80
Colors.
Foundation.
Navy.
700
#2c4466
Colors.
Foundation.
Sky.
500
#3b8fd9
Colors.
Foundation.
Gray.
100
#f3f4f6
Colors.
Foundation.
Gray.
500
#6b7280
Colors.
Foundation.
Gray.
900
#111827
Colors.
Foundation.
White
#ffffff
Dimensions.
spacing.
1
4 · unused
Dimensions.
spacing.
2
8
Dimensions.
spacing.
4
16
Dimensions.
spacing.
8
32
Dimensions.
radius.
sm
4
Dimensions.
radius.
md
8
Dimensions.
radius.
pill
999 · unused
Effects.
opacity.
50
50
Effects.
opacity.
80
80 · unused
Effects.
blur.
sm
4 · unused
Effects.
blur.
md
12
Typography.
FontFamily.
Sans
Inter
Typography.
FontFamily.
Serif
Source Serif 4
Typography.
FontSize.
sm
14
Typography.
FontSize.
md
16
Typography.
FontSize.
lg
20
Typography.
FontSize.
xl
28
Brand(Alias)
BrandB
11 tokens
1 error
Colors.
Brand.
Primary
→ Colors.
Foundation.
Navy.
500
#3d5a80
Colors.
Brand.
Primary Dark
→ Colors.
Foundation.
Navy.
700
#2c4466
Colors.
Brand.
Accent
→ Colors.
Foundation.
Sky.
550
does not exist
error
Colors.
Surface.
Default
→ Colors.
Foundation.
White
#ffffff
Colors.
Surface.
Muted
→ Colors.
Foundation.
Gray.
100
#f3f4f6
Colors.
Text.
Default
→ Colors.
Foundation.
Gray.
900
#111827
Colors.
Text.
Muted
→ Colors.
Foundation.
Gray.
500
#6b7280
Colors.
Text.
On Primary
→ Colors.
Foundation.
White
#ffffff
Typography.
Body.
Family
→ Typography.
FontFamily.
Serif
Source Serif 4
Effects.
overlay.
Opacity
→ Effects.
opacity.
50
50
Effects.
shadow.
Blur
→ Effects.
blur.
md
12
ScreenType
Desktop
5 tokens
Spacing.
Gap
→ Dimensions.
spacing.
4
16
Spacing.
Padding
→ Dimensions.
spacing.
8
32
Typography.
Body.
Size
→ Typography.
FontSize.
md
16
Typography.
Heading.
Size
→ Typography.
FontSize.
xl
28
Radius.
Card
→ Dimensions.
radius.
md
8
Graphite
Primitives
Mode 1
26 tokens
1 error
error · default mode name
. Show in lint
Colors.
Foundation.
Blue.
500
#0057b8
Colors.
Foundation.
Blue.
700
#003f8a
Colors.
Foundation.
Navy.
500
#3d5a80
Colors.
Foundation.
Navy.
700
#2c4466
Colors.
Foundation.
Sky.
500
#3b8fd9
Colors.
Foundation.
Gray.
100
#f3f4f6
Colors.
Foundation.
Gray.
500
#6b7280
Colors.
Foundation.
Gray.
900
#111827
Colors.
Foundation.
White
#ffffff
Dimensions.
spacing.
1
4 · unused
Dimensions.
spacing.
2
8
Dimensions.
spacing.
4
16
Dimensions.
spacing.
8
32
Dimensions.
radius.
sm
4
Dimensions.
radius.
md
8
Dimensions.
radius.
pill
999 · unused
Effects.
opacity.
50
50
Effects.
opacity.
80
80 · unused
Effects.
blur.
sm
4 · unused
Effects.
blur.
md
12
Typography.
FontFamily.
Sans
Inter
Typography.
FontFamily.
Serif
Source Serif 4
Typography.
FontSize.
sm
14
Typography.
FontSize.
md
16
Typography.
FontSize.
lg
20
Typography.
FontSize.
xl
28
Brand(Alias)
BrandB
11 tokens
1 error
Colors.
Brand.
Primary
→ Colors.
Foundation.
Navy.
500
#3d5a80
Colors.
Brand.
Primary Dark
→ Colors.
Foundation.
Navy.
700
#2c4466
Colors.
Brand.
Accent
→ Colors.
Foundation.
Sky.
550
does not exist
error
Colors.
Surface.
Default
→ Colors.
Foundation.
White
#ffffff
Colors.
Surface.
Muted
→ Colors.
Foundation.
Gray.
100
#f3f4f6
Colors.
Text.
Default
→ Colors.
Foundation.
Gray.
900
#111827
Colors.
Text.
Muted
→ Colors.
Foundation.
Gray.
500
#6b7280
Colors.
Text.
On Primary
→ Colors.
Foundation.
White
#ffffff
Typography.
Body.
Family
→ Typography.
FontFamily.
Serif
Source Serif 4
Effects.
overlay.
Opacity
→ Effects.
opacity.
50
50
Effects.
shadow.
Blur
→ Effects.
blur.
md
12
ScreenType
Desktop
5 tokens
Spacing.
Gap
→ Dimensions.
spacing.
4
16
Spacing.
Padding
→ Dimensions.
spacing.
8
32
Typography.
Body.
Size
→ Typography.
FontSize.
md
16
Typography.
Heading.
Size
→ Typography.
FontSize.
xl
28
Radius.
Card
→ Dimensions.
radius.
md
8