For agents: an index of these docs is at /docs/llms.txt, and this page as markdown is at /docs/tokens.md.

Tokens and themes

Themes as CSS variables.

Themes for Signet as plain CSS variables: colour, radius, type, shadow and motion. A theme is one CSS file that defines the variables in the theme contract. Docs: https://signet.dapplelight.in/

Themes

File	Look
`editorial.css`	warm paper, ink text, green accent
`cinematic.css`	cool neutrals, violet accent
`finance.css`	editorial plus money and spend-category slots

Each has light and dark (the .dark class). Every text pair meets WCAG AA, and a test checks it.

Use

@import "tailwindcss";
@import "@dapplelight/signet-tokens/editorial.css";
@import "@dapplelight/signet-tokens/base.css";

base.css adds the body defaults, focus outline, the overlay animations (tw-animate-css) and a reduced-motion rule.

Make your own theme

Copy a theme file, change the values, and keep every variable the contract lists. @dapplelight/signet-ui reads only these variables, so the components follow.

License

MIT