Arcade Palette

01How it worksBuilt on the Radix Colors methodology — an exponential lightness curve, adaptive saturation correction, and WCAG 2.1 contrast checks. No AI at runtime — only mathematical color models. Predictable, repeatable results.

02What Arcade doesEnter 1 to 3 colors and get a design system:

Brand PaletteA 12-step scale for guidelines and marketing. Each step has a role — page background, surface, borders, text, primary.

Design SystemA full set of palettes: brand, neutral, accent, success, warning, error, info.

Semantic tokensbg.page, text.primary, button.primary.bg, border.focus and more. Every token aliases a raw color.

PreviewToken Map, components, gradients, dashboard, and marketing layouts.

Figma exportJSON with raw tokens and semantic aliases. Imports into Figma as a collection of variables with inheritance. Tokens follow Tailwind numbering (50–1000).

Canvas & contrastLight / dark canvas to match the environment. A contrast slider tunes shadow depth and text brightness.