Hydrated, never repainted.
This card lives inside the component's shadow root and reads the same document-level custom properties as the page around it.
Primary
Secondary
Native Fragments · Design tokens
One token set,
two DOM worlds.
Pick a theme below. The light DOM page, the server-rendered Shadow DOM controls, and the live preview all recolour from a single set of CSS custom properties.
Ink on surface clears WCAG AA in every token set.
Design tokens
Dawn desk
| Token | Value |
|---|---|
| #f1eadc | |
| #fffaf0 | |
| #17211b | |
| #5a6358 | |
| #2f68d8 | |
| #dc4c33 | |
| #b78319 |