Color, at every step.

Twenty-six palettes. Eleven shades each. A broad reference library alongside antiflex’s purpose-built light and dark themes.

Select a swatch to inspect and copy its value.

26 of 26 palettes · 11 steps per palette

Palette, purpose, component

These reference ramps match Tailwind CSS 4.3.3. antiflex’s existing neutral tokens define the default light and dark themes; mint remains available as an optional primitive palette. Use semantic roles for interface meaning and raw palettes for deliberate customization.

/* Reference primitive */
background: var(--af-palette-blue-500);
/* Tailwind: bg-af-blue-500 text-af-blue-950 */

/* antiflex semantic role follows the current theme */
color: var(--af-semantic-foreground);

/* Component alias */
background: var(--af-component-button-bg);

Wide gamut, clear boundaries

CSS preserves canonical OKLCH values. HEX and Figma swatches use a clipped sRGB preview; very vivid colors can differ on wide-gamut displays. Raw shades do not switch automatically in dark mode. Choose accessible foreground/background pairs, or use antiflex’s theme-aware semantic roles.

Reference values are distributed under the Tailwind CSS MIT license. See the official color documentation.