Everything below is generated from the token contract in the repo’s DESIGN.md front matter. The build validates that file, and both sites take their styles from it. The numbers were measured from lusion.co and are checked by check-design-md.py, including WCAG AA contrast on every component pairing.
Colors
primary#1a2ffb · 6.56:1 on background
on-primary#f0f1fa · 1.00:1 on background
background#f0f1fa · 1.00:1 on background
surface#ffffff · 1.12:1 on background
ink#000000 · 18.67:1 on background
ink-muted#2b2e3a · 12.01:1 on background
inverse-background#000000 · 18.67:1 on background
inverse-ink#f0f1fa · 1.00:1 on background
Typography
The quick brown fox
The quick brown fox
The quick brown fox
The quick brown fox
Spacing
xs8px
sm16px
md24px
lg40px
xl64px
2xl96px
section160px
Radii
sm · 10px
md · 15px
lg · 20px
pill · 100px
Components
Button primary1Categorytag
card · surface on background, rounded-lg
footer · inverse panel, rounded-lg
Rendered with the site’s live component classes. If the contract or the implementation changes, this page changes with it.