Colour Palette Generator
Generate a colour palette from a starting colour, then copy hex, RGB, or CSS variables.
Presets
Lighter
#77d9c0
Light
#33b796
Base
#1f6f5b
Dark
#0d2f27
Darker
#071814
Lock a swatch to keep it when you randomise. Click a colour to make it the starting colour.
Worked example
Start from #1f6f5b in Tints & shades and you’ll get five related swatches. Lock Base, then randomise — the locked colour stays while the rest move.
FAQ
- How are the colours chosen?
- They’re offsets from your starting colour for the harmony you pick: tints, complementary, analogous, triadic, or monochrome.
- What does lock do?
- A locked swatch is kept when you randomise. Unlock it if you want that slot to move again.
- What can I copy?
- Each hex, the whole list, CSS custom properties, or JSON. Contrast is a separate check — use Contrast Checker before pairing text and background.