Skip to main content

Glossary · design tokens

CSS Custom Properties

User-defined CSS variables (e.g. `--color-accent`) scoped to a selector and inherited by descendants.

CSS custom properties (often called CSS variables) declare a value on a selector — usually `:root` — and reference it via `var(--name)`. They are the modern bridge between design tokens and runtime CSS: a single source of truth that themes and components both read. Most catalogued sites with rigorous design systems (Linear, Vercel, Stripe) expose dozens to hundreds of custom properties; AI2 Design's CSS export format mirrors this convention.

Also known as

  • CSS variables

External reference

MDN — Custom Properties

Catalogued examples

2 catalogued sites demonstrate css custom properties in production.

All glossary terms

AI2 Design counts anonymous traffic always — no cookies, no identifiers, no fingerprinting. For optional session insights (PostHog, EU region) — page funnel, performance — turn on opt-in analytics below. Cookie policy.