FOUNDATIONS
Small values. System-wide impact.
One source of truth for the decisions that connect every component.
Global tokens
143Raw values. Reusable decisions.
Theme tokens
53Purpose, expressed through aliases.
| Token | Value | Purpose | Layer |
|---|---|---|---|
ux.prototype.theme.color.background.primary | {ux.prototype.global.color.blue.60} | Semantic alias from UX Prototype V1 · background / primary | Theme |
ux.prototype.theme.color.background.landmark_baseline | {ux.prototype.global.color.blue.80} | Semantic alias from UX Prototype V1 · background / landmark_baseline | Theme |
ux.prototype.theme.color.background.landmark_sunken | {ux.prototype.global.color.blue.90} | Semantic alias from UX Prototype V1 · background / landmark_sunken | Theme |
ux.prototype.theme.color.background.sunken | {ux.prototype.global.color.slate.10} | Semantic alias from UX Prototype V1 · background / sunken | Theme |
ux.prototype.theme.color.background.baseline | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · background / baseline | Theme |
ux.prototype.theme.color.background.baseline_inverse | {ux.prototype.global.color.slate.90} | Semantic alias from UX Prototype V1 · background / baseline_inverse | Theme |
ux.prototype.theme.color.background.raised | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · background / raised | Theme |
ux.prototype.theme.color.background.overlay | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · background / overlay | Theme |
ux.prototype.theme.color.background.negative | {ux.prototype.global.color.red.10} | Semantic alias from UX Prototype V1 · background / negative | Theme |
ux.prototype.theme.color.background.info | {ux.prototype.global.color.purple.10} | Semantic alias from UX Prototype V1 · background / info | Theme |
ux.prototype.theme.color.background.info_inverse | {ux.prototype.global.color.purple.60} | Semantic alias from UX Prototype V1 · background / info_inverse | Theme |
ux.prototype.theme.color.background.raised_inverse | {ux.prototype.global.color.slate.90} | Semantic alias from UX Prototype V1 · background / raised_inverse | Theme |
ux.prototype.theme.color.background.positive | {ux.prototype.global.color.green.10} | Semantic alias from UX Prototype V1 · background / positive | Theme |
ux.prototype.theme.color.background.positive_inverse | {ux.prototype.global.color.green.60} | Semantic alias from UX Prototype V1 · background / positive_inverse | Theme |
ux.prototype.theme.color.background.landmark_primary | {ux.prototype.global.color.blue.20} | Semantic alias from UX Prototype V1 · background / landmark_primary | Theme |
ux.prototype.theme.color.background.warning | {ux.prototype.global.color.orange.10} | Semantic alias from UX Prototype V1 · background / warning | Theme |
ux.prototype.theme.color.background.warning_inverse | {ux.prototype.global.color.orange.60} | Semantic alias from UX Prototype V1 · background / warning_inverse | Theme |
ux.prototype.theme.color.background.negative_inverse | {ux.prototype.global.color.red.60} | Semantic alias from UX Prototype V1 · background / negative_inverse | Theme |
ux.prototype.theme.color.background.disabled | {ux.prototype.global.color.slate.40} | Semantic alias from UX Prototype V1 · background / disabled | Theme |
ux.prototype.theme.color.background.primary_inverse | {ux.prototype.global.color.blue.20} | Semantic alias from UX Prototype V1 · background / primary_inverse | Theme |
ux.prototype.theme.color.foreground.primary | {ux.prototype.global.color.blue.60} | Semantic alias from UX Prototype V1 · foreground / primary | Theme |
ux.prototype.theme.color.foreground.on_landmark | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · foreground / on_landmark | Theme |
ux.prototype.theme.color.foreground.on_landmark_primary | {ux.prototype.global.color.slate.90} | Semantic alias from UX Prototype V1 · foreground / on_landmark_primary | Theme |
ux.prototype.theme.color.foreground.neutral_high | {ux.prototype.global.color.slate.90} | Semantic alias from UX Prototype V1 · foreground / neutral_high | Theme |
ux.prototype.theme.color.foreground.neutral_high_inverse | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · foreground / neutral_high_inverse | Theme |
ux.prototype.theme.color.foreground.neutral_medium | {ux.prototype.global.color.slate.80} | Semantic alias from UX Prototype V1 · foreground / neutral_medium | Theme |
ux.prototype.theme.color.foreground.neutral_low | {ux.prototype.global.color.slate.70} | Semantic alias from UX Prototype V1 · foreground / neutral_low | Theme |
ux.prototype.theme.color.foreground.info | {ux.prototype.global.color.purple.50} | Semantic alias from UX Prototype V1 · foreground / info | Theme |
ux.prototype.theme.color.foreground.positive | {ux.prototype.global.color.green.50} | Semantic alias from UX Prototype V1 · foreground / positive | Theme |
ux.prototype.theme.color.foreground.warning | {ux.prototype.global.color.orange.60} | Semantic alias from UX Prototype V1 · foreground / warning | Theme |
ux.prototype.theme.color.foreground.negative | {ux.prototype.global.color.red.50} | Semantic alias from UX Prototype V1 · foreground / negative | Theme |
ux.prototype.theme.color.foreground.disabled | {ux.prototype.global.color.slate.40} | Semantic alias from UX Prototype V1 · foreground / disabled | Theme |
ux.prototype.theme.color.foreground.on_primary | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · foreground / on_primary | Theme |
ux.prototype.theme.color.foreground.info_inverse | {ux.prototype.global.color.purple.20} | Semantic alias from UX Prototype V1 · foreground / info_inverse | Theme |
ux.prototype.theme.color.foreground.positive_inverse | {ux.prototype.global.color.green.20} | Semantic alias from UX Prototype V1 · foreground / positive_inverse | Theme |
ux.prototype.theme.color.foreground.warning_inverse | {ux.prototype.global.color.orange.20} | Semantic alias from UX Prototype V1 · foreground / warning_inverse | Theme |
ux.prototype.theme.color.foreground.negative_inverse | {ux.prototype.global.color.red.20} | Semantic alias from UX Prototype V1 · foreground / negative_inverse | Theme |
ux.prototype.theme.color.outline.neutral_high | {ux.prototype.global.color.slate.90} | Semantic alias from UX Prototype V1 · outline / neutral_high | Theme |
ux.prototype.theme.color.outline.neutral_high_inverse | {ux.prototype.global.color.white.a100} | Semantic alias from UX Prototype V1 · outline / neutral_high_inverse | Theme |
ux.prototype.theme.color.outline.neutral_medium | {ux.prototype.global.color.slate.60} | Semantic alias from UX Prototype V1 · outline / neutral_medium | Theme |
ux.prototype.theme.color.outline.neutral_low | {ux.prototype.global.color.slate.20} | Semantic alias from UX Prototype V1 · outline / neutral_low | Theme |
ux.prototype.theme.color.outline.negative | {ux.prototype.global.color.red.50} | Semantic alias from UX Prototype V1 · outline / negative | Theme |
ux.prototype.theme.color.outline.disabled | {ux.prototype.global.color.slate.40} | Semantic alias from UX Prototype V1 · outline / disabled | Theme |
ux.prototype.theme.color.outline.primary | {ux.prototype.global.color.blue.60} | Semantic alias from UX Prototype V1 · outline / primary | Theme |
ux.prototype.theme.color.outline.primary_on_landmark | {ux.prototype.global.color.blue.20} | Semantic alias from UX Prototype V1 · outline / primary_on_landmark | Theme |
ux.prototype.theme.color.outline.positive | {ux.prototype.global.color.green.50} | Semantic alias from UX Prototype V1 · outline / positive | Theme |
ux.prototype.theme.color.outline.info | {ux.prototype.global.color.purple.50} | Semantic alias from UX Prototype V1 · outline / info | Theme |
ux.prototype.theme.color.outline.warning | {ux.prototype.global.color.orange.50} | Semantic alias from UX Prototype V1 · outline / warning | Theme |
ux.prototype.global.color.red.10 | #f8eaea | Global value from UX Prototype V1 · red / 10 | Global |
ux.prototype.global.color.red.20 | #e0a3a2 | Global value from UX Prototype V1 · red / 20 | Global |
ux.prototype.global.color.red.30 | #d58180 | Global value from UX Prototype V1 · red / 30 | Global |
ux.prototype.global.color.red.40 | #c75756 | Global value from UX Prototype V1 · red / 40 | Global |
ux.prototype.global.color.red.50 | #b92d2c | Global value from UX Prototype V1 · red / 50 | Global |
ux.prototype.global.color.red.60 | #942423 | Global value from UX Prototype V1 · red / 60 | Global |
ux.prototype.global.color.red.70 | #6f1b1a | Global value from UX Prototype V1 · red / 70 | Global |
ux.prototype.global.color.red.80 | #380e0d | Global value from UX Prototype V1 · red / 80 | Global |
ux.prototype.global.color.red.90 | #250909 | Global value from UX Prototype V1 · red / 90 | Global |
ux.prototype.global.color.yellow.10 | #fff8e5 | Global value from UX Prototype V1 · yellow / 10 | Global |
ux.prototype.global.color.yellow.20 | #fede8f | Global value from UX Prototype V1 · yellow / 20 | Global |
ux.prototype.global.color.yellow.30 | #fdd266 | Global value from UX Prototype V1 · yellow / 30 | Global |
ux.prototype.global.color.yellow.40 | #fdc333 | Global value from UX Prototype V1 · yellow / 40 | Global |
ux.prototype.global.color.yellow.50 | #fcb400 | Global value from UX Prototype V1 · yellow / 50 | Global |
ux.prototype.global.color.yellow.60 | #ca9000 | Global value from UX Prototype V1 · yellow / 60 | Global |
ux.prototype.global.color.yellow.70 | #976c00 | Global value from UX Prototype V1 · yellow / 70 | Global |
ux.prototype.global.color.yellow.80 | #4c3600 | Global value from UX Prototype V1 · yellow / 80 | Global |
ux.prototype.global.color.yellow.90 | #322400 | Global value from UX Prototype V1 · yellow / 90 | Global |
ux.prototype.global.color.green.10 | #e6f2ee | Global value from UX Prototype V1 · green / 10 | Global |
ux.prototype.global.color.green.20 | #91c4b5 | Global value from UX Prototype V1 · green / 20 | Global |
ux.prototype.global.color.green.30 | #69af9a | Global value from UX Prototype V1 · green / 30 | Global |
ux.prototype.global.color.green.40 | #379579 | Global value from UX Prototype V1 · green / 40 | Global |
ux.prototype.global.color.green.50 | #057a57 | Global value from UX Prototype V1 · green / 50 | Global |
ux.prototype.global.color.green.60 | #046246 | Global value from UX Prototype V1 · green / 60 | Global |
ux.prototype.global.color.green.70 | #034934 | Global value from UX Prototype V1 · green / 70 | Global |
ux.prototype.global.color.green.80 | #02251a | Global value from UX Prototype V1 · green / 80 | Global |
ux.prototype.global.color.green.90 | #011811 | Global value from UX Prototype V1 · green / 90 | Global |
ux.prototype.global.color.blue.10 | #e8f0f8 | Global value from UX Prototype V1 · blue / 10 | Global |
ux.prototype.global.color.blue.20 | #9bc0e1 | Global value from UX Prototype V1 · blue / 20 | Global |
ux.prototype.global.color.blue.30 | #76a8d6 | Global value from UX Prototype V1 · blue / 30 | Global |
ux.prototype.global.color.blue.40 | #498bc9 | Global value from UX Prototype V1 · blue / 40 | Global |
ux.prototype.global.color.blue.50 | #1b6ebb | Global value from UX Prototype V1 · blue / 50 | Global |
ux.prototype.global.color.blue.60 | #165896 | Global value from UX Prototype V1 · blue / 60 | Global |
ux.prototype.global.color.blue.70 | #104270 | Global value from UX Prototype V1 · blue / 70 | Global |
ux.prototype.global.color.blue.80 | #082138 | Global value from UX Prototype V1 · blue / 80 | Global |
ux.prototype.global.color.blue.90 | #051625 | Global value from UX Prototype V1 · blue / 90 | Global |
ux.prototype.global.color.slate.10 | #f3f4f6 | Global value from UX Prototype V1 · slate / 10 | Global |
ux.prototype.global.color.slate.20 | #e4e7eb | Global value from UX Prototype V1 · slate / 20 | Global |
ux.prototype.global.color.slate.30 | #b5bfc8 | Global value from UX Prototype V1 · slate / 30 | Global |
ux.prototype.global.color.slate.40 | #9da9b6 | Global value from UX Prototype V1 · slate / 40 | Global |
ux.prototype.global.color.slate.50 | #8494a4 | Global value from UX Prototype V1 · slate / 50 | Global |
ux.prototype.global.color.slate.60 | #6a7683 | Global value from UX Prototype V1 · slate / 60 | Global |
ux.prototype.global.color.slate.70 | #4f5962 | Global value from UX Prototype V1 · slate / 70 | Global |
ux.prototype.global.color.slate.80 | #282c31 | Global value from UX Prototype V1 · slate / 80 | Global |
ux.prototype.global.color.slate.90 | #1a1e21 | Global value from UX Prototype V1 · slate / 90 | Global |
ux.prototype.global.color.white.a10 | #ffffff1a | Global value from UX Prototype V1 · white / a10 | Global |
ux.prototype.global.color.white.a20 | #ffffff33 | Global value from UX Prototype V1 · white / a20 | Global |
ux.prototype.global.color.white.a30 | #ffffff4d | Global value from UX Prototype V1 · white / a30 | Global |
ux.prototype.global.color.white.a40 | #ffffff66 | Global value from UX Prototype V1 · white / a40 | Global |
ux.prototype.global.color.white.a50 | #ffffff80 | Global value from UX Prototype V1 · white / a50 | Global |
ux.prototype.global.color.white.a60 | #ffffff99 | Global value from UX Prototype V1 · white / a60 | Global |
ux.prototype.global.color.white.a70 | #ffffffb2 | Global value from UX Prototype V1 · white / a70 | Global |
ux.prototype.global.color.white.a80 | #ffffffcc | Global value from UX Prototype V1 · white / a80 | Global |
ux.prototype.global.color.white.a90 | #ffffffe5 | Global value from UX Prototype V1 · white / a90 | Global |
ux.prototype.global.color.white.a100 | #ffffff | Global value from UX Prototype V1 · white / a100 | Global |
ux.prototype.global.color.onyx.60 | #313a42 | Global value from UX Prototype V1 · onyx / 60 | Global |
ux.prototype.global.color.onyx.70 | #212a33 | Global value from UX Prototype V1 · onyx / 70 | Global |
ux.prototype.global.color.onyx.80 | #151f28 | Global value from UX Prototype V1 · onyx / 80 | Global |
ux.prototype.global.color.onyx.90 | #111920 | Global value from UX Prototype V1 · onyx / 90 | Global |
ux.prototype.global.color.onyx.100 | #0d1318 | Global value from UX Prototype V1 · onyx / 100 | Global |
ux.prototype.global.color.onyx.110 | #020304 | Global value from UX Prototype V1 · onyx / 110 | Global |
ux.prototype.global.color.orange.10 | #fbf0e7 | Global value from UX Prototype V1 · orange / 10 | Global |
ux.prototype.global.color.orange.20 | #efbc97 | Global value from UX Prototype V1 · orange / 20 | Global |
ux.prototype.global.color.orange.30 | #eaa472 | Global value from UX Prototype V1 · orange / 30 | Global |
ux.prototype.global.color.orange.40 | #e38543 | Global value from UX Prototype V1 · orange / 40 | Global |
ux.prototype.global.color.orange.50 | #dc6714 | Global value from UX Prototype V1 · orange / 50 | Global |
ux.prototype.global.color.orange.60 | #b05210 | Global value from UX Prototype V1 · orange / 60 | Global |
ux.prototype.global.color.orange.70 | #843e0c | Global value from UX Prototype V1 · orange / 70 | Global |
ux.prototype.global.color.orange.80 | #421f06 | Global value from UX Prototype V1 · orange / 80 | Global |
ux.prototype.global.color.orange.90 | #2c1504 | Global value from UX Prototype V1 · orange / 90 | Global |
ux.prototype.global.color.black.a10 | #0000001a | Global value from UX Prototype V1 · black / a10 | Global |
ux.prototype.global.color.black.a20 | #00000033 | Global value from UX Prototype V1 · black / a20 | Global |
ux.prototype.global.color.black.a30 | #0000004d | Global value from UX Prototype V1 · black / a30 | Global |
ux.prototype.global.color.black.a40 | #00000066 | Global value from UX Prototype V1 · black / a40 | Global |
ux.prototype.global.color.black.a50 | #00000080 | Global value from UX Prototype V1 · black / a50 | Global |
ux.prototype.global.color.black.a60 | #00000099 | Global value from UX Prototype V1 · black / a60 | Global |
ux.prototype.global.color.black.a70 | #000000b2 | Global value from UX Prototype V1 · black / a70 | Global |
ux.prototype.global.color.black.a80 | #000000cc | Global value from UX Prototype V1 · black / a80 | Global |
ux.prototype.global.color.black.a90 | #000000e5 | Global value from UX Prototype V1 · black / a90 | Global |
ux.prototype.global.color.black.a100 | #000000 | Global value from UX Prototype V1 · black / a100 | Global |
ux.prototype.global.color.purple.10 | #f1eafd | Global value from UX Prototype V1 · purple / 10 | Global |
ux.prototype.global.color.purple.20 | #c3a3f8 | Global value from UX Prototype V1 · purple / 20 | Global |
ux.prototype.global.color.purple.30 | #ad81f5 | Global value from UX Prototype V1 · purple / 30 | Global |
ux.prototype.global.color.purple.40 | #9157f1 | Global value from UX Prototype V1 · purple / 40 | Global |
ux.prototype.global.color.purple.50 | #762dee | Global value from UX Prototype V1 · purple / 50 | Global |
ux.prototype.global.color.purple.60 | #5e24be | Global value from UX Prototype V1 · purple / 60 | Global |
ux.prototype.global.color.purple.70 | #471b8f | Global value from UX Prototype V1 · purple / 70 | Global |
ux.prototype.global.color.purple.80 | #230e47 | Global value from UX Prototype V1 · purple / 80 | Global |
ux.prototype.global.color.purple.90 | #180930 | Global value from UX Prototype V1 · purple / 90 | Global |
ux.prototype.global.color.ocean.10 | #e5eef5 | Global value from UX Prototype V1 · ocean / 10 | Global |
ux.prototype.global.color.ocean.20 | #8eb3d5 | Global value from UX Prototype V1 · ocean / 20 | Global |
ux.prototype.global.color.ocean.30 | #6698c5 | Global value from UX Prototype V1 · ocean / 30 | Global |
ux.prototype.global.color.ocean.40 | #3375b2 | Global value from UX Prototype V1 · ocean / 40 | Global |
ux.prototype.global.color.ocean.50 | #00539f | Global value from UX Prototype V1 · ocean / 50 | Global |
ux.prototype.global.color.ocean.60 | #00427f | Global value from UX Prototype V1 · ocean / 60 | Global |
ux.prototype.global.color.ocean.70 | #00325f | Global value from UX Prototype V1 · ocean / 70 | Global |
ux.prototype.global.color.ocean.80 | #001930 | Global value from UX Prototype V1 · ocean / 80 | Global |
ux.prototype.global.color.ocean.90 | #001120 | Global value from UX Prototype V1 · ocean / 90 | Global |
ux.prototype.global.color.cyan.10 | #e5f5fc | Global value from UX Prototype V1 · cyan / 10 | Global |
ux.prototype.global.color.cyan.20 | #8ed5f2 | Global value from UX Prototype V1 · cyan / 20 | Global |
ux.prototype.global.color.cyan.30 | #66c6ec | Global value from UX Prototype V1 · cyan / 30 | Global |
ux.prototype.global.color.cyan.40 | #33b3e6 | Global value from UX Prototype V1 · cyan / 40 | Global |
ux.prototype.global.color.cyan.50 | #00a0e0 | Global value from UX Prototype V1 · cyan / 50 | Global |
ux.prototype.global.color.cyan.60 | #0080b3 | Global value from UX Prototype V1 · cyan / 60 | Global |
ux.prototype.global.color.cyan.70 | #006086 | Global value from UX Prototype V1 · cyan / 70 | Global |
ux.prototype.global.color.cyan.80 | #003043 | Global value from UX Prototype V1 · cyan / 80 | Global |
ux.prototype.global.color.cyan.90 | #00202d | Global value from UX Prototype V1 · cyan / 90 | Global |
ux.prototype.global.border.radius.4 | 4px | Global value from UX Prototype V1 · radius / 4 | Global |
ux.prototype.global.border.radius.12 | 12px | Global value from UX Prototype V1 · radius / 12 | Global |
ux.prototype.global.border.radius.16 | 16px | Global value from UX Prototype V1 · radius / 16 | Global |
ux.prototype.global.border.radius.20 | 20px | Global value from UX Prototype V1 · radius / 20 | Global |
ux.prototype.global.border.radius.24 | 24px | Global value from UX Prototype V1 · radius / 24 | Global |
ux.prototype.global.border.radius.8 | 8px | Global value from UX Prototype V1 · radius / 8 | Global |
ux.prototype.global.border.width.1 | 1px | Global value from UX Prototype V1 · width / 1 | Global |
ux.prototype.global.border.width.2 | 2px | Global value from UX Prototype V1 · width / 2 | Global |
ux.prototype.theme.border.width.thin | {ux.prototype.global.border.width.1} | Semantic alias from UX Prototype V1 · width / thin | Theme |
ux.prototype.theme.border.width.medium | {ux.prototype.global.border.width.2} | Semantic alias from UX Prototype V1 · width / medium | Theme |
ux.prototype.global.screen.breakpoint.xsmall | 480px | Global value from UX Prototype V1 · breakpoint / xsmall | Global |
ux.prototype.global.screen.breakpoint.small | 640px | Global value from UX Prototype V1 · breakpoint / small | Global |
ux.prototype.global.screen.breakpoint.medium | 800px | Global value from UX Prototype V1 · breakpoint / medium | Global |
ux.prototype.global.screen.breakpoint.large | 960px | Global value from UX Prototype V1 · breakpoint / large | Global |
ux.prototype.global.screen.breakpoint.xlarge | 1200px | Global value from UX Prototype V1 · breakpoint / xlarge | Global |
ux.prototype.global.screen.breakpoint.xxlarge | 1600px | Global value from UX Prototype V1 · breakpoint / xxlarge | Global |
ux.prototype.theme.border.radius.small | {ux.prototype.global.border.radius.4} | Semantic alias from UX Prototype V1 · radius / small | Theme |
ux.prototype.theme.border.radius.medium | {ux.prototype.global.border.radius.8} | Semantic alias from UX Prototype V1 · radius / medium | Theme |
ux.prototype.theme.border.radius.large | {ux.prototype.global.border.radius.20} | Semantic alias from UX Prototype V1 · radius / large | Theme |
ux.prototype.global.space.32 | 32px | Global value from UX Prototype V1 · 32 | Global |
ux.prototype.global.space.4 | 4px | Global value from UX Prototype V1 · 4 | Global |
ux.prototype.global.space.12 | 12px | Global value from UX Prototype V1 · 12 | Global |
ux.prototype.global.space.20 | 20px | Global value from UX Prototype V1 · 20 | Global |
ux.prototype.global.space.24 | 24px | Global value from UX Prototype V1 · 24 | Global |
ux.prototype.global.space.40 | 40px | Global value from UX Prototype V1 · 40 | Global |
ux.prototype.global.space.48 | 48px | Global value from UX Prototype V1 · 48 | Global |
ux.prototype.global.space.64 | 64px | Global value from UX Prototype V1 · 64 | Global |
ux.prototype.global.typography.size.12 | 12px | Global value from UX Prototype V1 · size / 12 | Global |
ux.prototype.global.typography.size.14 | 14px | Global value from UX Prototype V1 · size / 14 | Global |
ux.prototype.global.typography.weight.400 | 400 | Global value from UX Prototype V1 · weight / 400 | Global |
ux.prototype.global.typography.weight.600 | 600 | Global value from UX Prototype V1 · weight / 600 | Global |
ux.prototype.global.typography.weight.700 | 700 | Global value from UX Prototype V1 · weight / 700 | Global |
ux.prototype.global.typography.family.dm_sans | DM Sans | Global value from UX Prototype V1 · family / dm_sans | Global |
ux.prototype.global.typography.size.16 | 16px | Global value from UX Prototype V1 · size / 16 | Global |
ux.prototype.global.typography.size.18 | 18px | Global value from UX Prototype V1 · size / 18 | Global |
ux.prototype.global.typography.size.20 | 20px | Global value from UX Prototype V1 · size / 20 | Global |
ux.prototype.global.typography.size.24 | 24px | Global value from UX Prototype V1 · size / 24 | Global |
ux.prototype.global.typography.size.28 | 28px | Global value from UX Prototype V1 · size / 28 | Global |
ux.prototype.global.typography.size.32 | 32px | Global value from UX Prototype V1 · size / 32 | Global |
ux.prototype.global.space.8 | 8px | Global value from UX Prototype V1 · 8 | Global |
ux.prototype.global.space.16 | 16px | Global value from UX Prototype V1 · 16 | Global |
Select a color swatch to copy its hex value.
196 tokens · DTCG 2025.10 export · UX Prototype V1 variable snapshot · light mode