← Standards

design-system

The canonical tokens live in /tokens and are documented under Design. Consumers style against semantic roles (--color-bg, --color-text, --color-accent, and the rest) and select a theme with data-theme="light" (default) or data-theme="void". A surface that hard-codes a hex value has left the system and will drift.

What this standard checks

  • At least one CSS file references the role tokens or a named theme, so a consumer is provably wired to the shared palette rather than its own.

Why

Tokens are generated from one source (tokens/tokens.json) and served at reference.nomograph.ai/tokens/*. Styling against roles means a theme swap is one attribute and a palette change propagates without touching consumers. nomograph.ai already consumes these tokens; this site is rendered from them.

How to adopt

@import "https://reference.nomograph.ai/tokens/colors.css";
@import "https://reference.nomograph.ai/tokens/themes.css";
fetch as markdown
curl https://reference.nomograph.ai/standards/design-system/index.md
check a repo against it
just -f ~/gitlab.com/nomograph/reference/justfile check-one design-system $PWD