New Inclusive Color System Tool Exports Semantic Tokens With Contrast Targets

Design · 4 min read

The new tool lets teams define color roles semantically, then automatically generates token sets optimized for different target contrast levels, including high-contrast and low-light palettes. Designers can simulate a range of vision conditions and preview how components behave when users switch to accessible palettes, exporting tokens in formats for popular frameworks.

Beyond automatic contrast recalculation, the tool embeds usage guidance into tokens, such as recommended text sizes and spacing for each role when used on busy backgrounds. It also includes a variant system to preserve brand identity while ensuring accessible minima, producing human-reviewed alternatives where automatic adjustments would break brand constraints.

Teams adopting the tool say it streamlines handoffs between design and engineering by delivering a single source of truth for color decisions and the accessibility rationale behind them. Accessibility leads appreciate the transparent audit trail that pairs each token with the target contrast level and test cases.