Vinaigrette to Maharaja Color Palette

About this palette

Vinaigrette to Maharaja is a 5-color muted palette: #EBDCAF (Vinaigrette), #BEB19A (Warm Neutral), #938785 (Zinc), #6A5F6F (Excalibur), #443958 (Maharaja). It mixes yellow, gray, purple tones and feels warm overall. The strongest text pairing is #EBDCAF on #443958 with a contrast ratio of 7.80:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Vinaigrette	rgb(235, 220, 175)	hsl(45, 60%, 80%)
Warm Neutral	rgb(190, 177, 154)	hsl(38, 22%, 67%)
Zinc	rgb(147, 135, 133)	hsl(9, 6%, 55%)
Excalibur	rgb(106, 95, 111)	hsl(281, 8%, 40%)
Maharaja	rgb(68, 57, 88)	hsl(261, 21%, 28%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa7.80:1 Very good#EBDCAF on #443958
Aa7.80:1 Very good#443958 on #EBDCAF
Aa5.04:1 Good#BEB19A on #443958
Aa5.04:1 Good#443958 on #BEB19A
Aa4.42:1 Poor#EBDCAF on #6A5F6F
Aa4.42:1 Poor#6A5F6F on #EBDCAF
Aa3.07:1 Poor#938785 on #443958
Aa3.07:1 Poor#443958 on #938785

Color blindness preview

CSS variables

/* Vinaigrette to Maharaja — https://swatchly.xyz/palette/ebdcaf-beb19a-938785-6a5f6f-443958 */
:root {
  --vinaigrette: #ebdcaf;
  --warm-neutral: #beb19a;
  --zinc: #938785;
  --excalibur: #6a5f6f;
  --maharaja: #443958;
}

Tailwind CSS v4

/* Vinaigrette to Maharaja — https://swatchly.xyz/palette/ebdcaf-beb19a-938785-6a5f6f-443958 */
@theme {
  --color-vinaigrette: #ebdcaf;
  --color-vinaigrette-50: #fff8e5;
  --color-vinaigrette-100: #f8efd5;
  --color-vinaigrette-200: #ebdcaf;
  --color-vinaigrette-300: #d1c5a0;
  --color-vinaigrette-400: #b2a47b;
  --color-vinaigrette-500: #96885e;
  --color-vinaigrette-600: #7a6c44;
  --color-vinaigrette-700: #615530;
  --color-vinaigrette-800: #4c4221;
  --color-vinaigrette-900: #3b3216;
  --color-vinaigrette-950: #251f0a;
  --color-warm-neutral: #beb19a;
  --color-warm-neutral-50: #f5edde;
  --color-warm-neutral-100: #e9e0d0;
  --color-warm-neutral-200: #d5cab7;
  --color-warm-neutral-300: #beb19a;
  --color-warm-neutral-400: #a1947e;
  --color-warm-neutral-500: #887c66;
  --color-warm-neutral-600: #6f644f;
  --color-warm-neutral-700: #5a503d;
  --color-warm-neutral-800: #483f2f;
  --color-warm-neutral-900: #3a3224;
  --color-warm-neutral-950: #241e14;
  --color-zinc: #938785;
  --color-zinc-50: #fbf4f3;
  --color-zinc-100: #f3eae9;
  --color-zinc-200: #e1d7d6;
  --color-zinc-300: #ccc1bf;
  --color-zinc-400: #aea2a0;
  --color-zinc-500: #938785;
  --color-zinc-600: #776c6a;
  --color-zinc-700: #5f5553;
  --color-zinc-800: #4b4240;
  --color-zinc-900: #393231;
  --color-zinc-950: #241e1d;
  --color-excalibur: #6a5f6f;
  --color-excalibur-50: #f9f2fc;
  --color-excalibur-100: #eee6f2;
  --color-excalibur-200: #dad0de;
  --color-excalibur-300: #c3b8c8;
  --color-excalibur-400: #a297a8;
  --color-excalibur-500: #867a8b;
  --color-excalibur-600: #6a5f6f;
  --color-excalibur-700: #544b59;
  --color-excalibur-800: #423a46;
  --color-excalibur-900: #332c36;
  --color-excalibur-950: #201b22;
  --color-maharaja: #443958;
  --color-maharaja-50: #f7f3ff;
  --color-maharaja-100: #eee7ff;
  --color-maharaja-200: #dbd2ef;
  --color-maharaja-300: #c5bada;
  --color-maharaja-400: #a59abd;
  --color-maharaja-500: #897ea1;
  --color-maharaja-600: #6e6384;
  --color-maharaja-700: #574d6a;
  --color-maharaja-800: #443958;
  --color-maharaja-900: #342c42;
  --color-maharaja-950: #201a2a;
}