Colour pairings

Plum and Mustard

Plum (#8E4585) paired with mustard (#D4A017). Below are both colours expanded into full 11-step ramps, generated in OKLCH for even lightness steps and gamut-mapped to sRGB. Copy the Tailwind v4 config for either, or open them in the generator to fine-tune.

Plum #8E4585
Mustard #D4A017
50#FFF1FB
100#FDDCF5
200#F9C0EE
300#EC9BE0
400#DA7ACE
500#BE5DB2
600#9F4B97
700#8E4585
800#643664
900#502E51
950#251227
plum — Tailwind v4@theme
@theme {
  --color-plum-50: #fff1fb;
  --color-plum-100: #fddcf5;
  --color-plum-200: #f9c0ee;
  --color-plum-300: #ec9be0;
  --color-plum-400: #da7ace;
  --color-plum-500: #be5db2;
  --color-plum-600: #9f4b97;
  --color-plum-700: #8e4585;
  --color-plum-800: #643664;
  --color-plum-900: #502e51;
  --color-plum-950: #251227;
}
50#FCF5E5
100#F5E6C6
200#EED297
300#DFB55A
400#D4A017
500#AB7F00
600#906900
700#7B5700
800#624300
900#50380B
950#261701
mustard — Tailwind v4@theme
@theme {
  --color-mustard-50: #fcf5e5;
  --color-mustard-100: #f5e6c6;
  --color-mustard-200: #eed297;
  --color-mustard-300: #dfb55a;
  --color-mustard-400: #d4a017;
  --color-mustard-500: #ab7f00;
  --color-mustard-600: #906900;
  --color-mustard-700: #7b5700;
  --color-mustard-800: #624300;
  --color-mustard-900: #50380b;
  --color-mustard-950: #261701;
}

Aesthetic

Want this palette built into your site?

You bring the colours. You'll get a site that uses them properly, designed and built by the team at Aesthetic.

More combinations