/palette

Palette

Generate a harmonic five-colour palette from a seed hue. Copy CSS variables with one click.

Hue Harmony Dark scheme

CSS

What this is: A palette generator that takes one seed hue and produces five colours using a named harmony rule. Useful for mocking up a brand, theming a dashboard, or just playing with colour relationships.
How it works: Hues are computed in HSL space from the seed (h) using classic colour-theory offsets (analogous ±30°, triadic ±120°, complementary +180°, etc.). Saturation and lightness are tuned for the chosen scheme. Each swatch reports its hex + its contrast ratio against white — aim for ≥4.5:1 for body text, ≥3:1 for large text (WCAG AA).
Worked example: Seed: 210° · Analogous · Light → #2c5aa0 #3f7ac7 #6ca7dd #96c2e6 #c1dcef Contrast on white: 6.1 · 4.3 · 3.1 · 2.2 · 1.5
Privacy: Runs entirely in your browser. No network requests. Nothing you paste or type leaves this tab.