Color Palette Generator
Build brand palettes from one seed color using color theory rules. Copy CSS variables or Tailwind config when you are ready to ship.
Free Tool Design System
Tools OverviewColor Palette Generator
Generate harmonious brand palettes from a seed color using color theory rules, then copy CSS variables and Tailwind config.
Catalog Context Part of Design System
See how this tool connects to category hubs, workflow paths, starter kits, and adjacent next steps.
Next Move - Strong resultDesign System
Recommended: Color Blindness CVD Simulator
Palette is ready. Verify it works for color-blind users next.
Seed Color
Pick a base color and harmony rule to build the palette.
Current base
#7C3AED
HSL 262° / 83% / 58%
Generated Palette
Click any color to copy its hex code.
Shades
Tints
CSS Variables
:root {
--color-1: #7C3AED;
--color-2: #ACED3B;
}Tailwind Config
colors: {
brand: {
1: '#7c3aed',
2: '#aced3b',
}
}
