Design tokens
Named design decisions (colors, typography, spacing, radius, shadows) exported into code-friendly formats like CSS variables, Tailwind config, or JSON.
WCAG contrast ratio
A measurement of readability between foreground and background colors. Higher ratios mean better readability.
WCAG AA / AAA
Accessibility conformance targets. AA is the practical baseline for most product UIs; AAA is stricter and often constrains color choices significantly.
Semantic colors
State/meaning colors like success, warning, danger, and info. They are used consistently across components regardless of brand palette.
Vibe
A high-level style preset that guides the generator’s choices (palette character, typography mood, density, and overall UI feel).
Direction
A controlled variation inside a Vibe that pushes the look in a specific art direction while staying recognizable and coherent.
Preset
A saved configuration you can reuse later (e.g. a palette + typography + settings snapshot).
Preview
A real UI layout used to validate that tokens work in context (surfaces, borders, typography hierarchy, component states), not just as swatches.
Export
The output you copy into a project: CSS variables, Tailwind theme extension, or JSON tokens. The goal is production usage without ChromUI running.