🎨
✏️

Generate Color Styles for Figma

Create color palettes to use as Figma Color Styles and design token foundations.

Ingen login krævet
Complementary · 2 colors

Figma tips

✏️

Generate your palette here, then create matching Color Styles in Figma. Paste each hex code when creating a new style.

💡

Figma Variables (design tokens) accept hex colors. Export your palette as hex values and create primitive tokens for each shade.

🎨

The shades palette produces a consistent tonal scale — map these to Figma token names like "primary-100" through "primary-900".

📋

Use "Copy all" to get all hex codes as a comma-separated list, then paste them into your design token JSON file or style guide document.

Sådan fungerer det

1
Indtast
Enter your data into the tool above. Everything stays local to your browser.
2
Behandl
The tool processes your data instantly in your browser using JavaScript. No server, no waiting.
3
Hent
Get your result instantly. Nothing is stored after you leave the page — complete privacy.

Hvorfor bruge vores?

Helt gratis — ingen skjulte omkostninger, nogensinde
Ingen konto, e-mail eller login krævet
Filer forlader aldrig din enhed
Ingen filstørrelsesbegrænsninger overhovedet
Ingen vandmærker på noget output

Also check out…

Ofte stillede spørgsmål