How to Use

Generate, preview, check, and export.

ColorMate is built around a quick workflow: create a palette, see it on real UI, adjust the direction, then copy the format you need.

1. Generate a palette

Press Generate Palette or use the Spacebar to create a new five-color palette. Choose a harmony type when you want a specific direction such as Analogous, Triadic, or Monochrome.

2. Lock colors and preview UI

Lock a color to keep it while regenerating the rest. The live preview applies the palette to buttons, cards, inputs, navigation, alerts, and dashboard-style blocks.

3. Export and reuse

Copy HEX, RGB, HSL, CSS variables, Tailwind config, or JSON. Uploaded images can also be sampled into a usable palette directly in the browser.