Scale Generator
Learn: Color variations→Choose a base color and generate a full tint/shade scale for design tokens.
Anchor color — the midpoint of your scale
11steps · Click any swatch to copy hex
Dark Side
Dark colors amount
Darkness
Dark hue angle
Dark saturation
Light Side
Light colors amount
Lightness
Light hue angle
Light saturation
One ramp is a start. A system needs the rest.
Perfect Palette ramps every color in your palette, then maps them to 21 semantic roles — surface, border, text, action, state — as token references, so changing a ramp updates everything pointing at it. Free to start, no account needed — color system tools are Plus, design.md authoring is Pro.