Design Tools

Build palettes, check accessibility contrast against WCAG, and convert colours between formats - with live swatches for everything.

Tool

Colour/Colour Palette

Build a harmonious palette from one base colour - complementary, analogous, triadic and more.

Palette

#5fecfc

#5f9efc

#6f5ffc

#bd5ffc

#fc5fec

Base colour

Harmony

Colours

:root {
  --color-1: #5fecfc;
  --color-2: #5f9efc;
  --color-3: #6f5ffc;
  --color-4: #bd5ffc;
  --color-5: #fc5fec;
}