Glazed Chestnut to Lilac Color Palette

About this palette

Glazed Chestnut to Lilac is a 5-color vibrant, cool, neon palette: #977200 (Glazed Chestnut), #D11AF3 (Trippy Velvet), #00A1EF (Fresh Blue of Bel Air), #00D47E (Seaweed), #C5ADFF (Lilac). It mixes yellow, purple, blue, green tones and feels cool overall. The strongest text pairing is #977200 on #C5ADFF with a contrast ratio of 2.29:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Glazed Chestnut	rgb(151, 114, 0)	hsl(45, 100%, 30%)
Trippy Velvet	rgb(209, 26, 243)	hsl(291, 90%, 53%)
Fresh Blue of Bel Air	rgb(0, 161, 239)	hsl(200, 100%, 47%)
Seaweed	rgb(0, 212, 126)	hsl(156, 100%, 42%)
Lilac	rgb(197, 173, 255)	hsl(258, 100%, 84%)

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.

Color blindness preview

CSS variables

/* Glazed Chestnut to Lilac — https://swatchly.xyz/palette/977200-d11af3-00a1ef-00d47e-c5adff */
:root {
  --glazed-chestnut: #977200;
  --trippy-velvet: #d11af3;
  --fresh-blue-of-bel-air: #00a1ef;
  --seaweed: #00d47e;
  --lilac: #c5adff;
}

Tailwind CSS v4

/* Glazed Chestnut to Lilac — https://swatchly.xyz/palette/977200-d11af3-00a1ef-00d47e-c5adff */
@theme {
  --color-glazed-chestnut: #977200;
  --color-glazed-chestnut-50: #fff4dd;
  --color-glazed-chestnut-100: #ffecc2;
  --color-glazed-chestnut-200: #f5d99c;
  --color-glazed-chestnut-300: #e4c47d;
  --color-glazed-chestnut-400: #c9a553;
  --color-glazed-chestnut-500: #b18b2f;
  --color-glazed-chestnut-600: #977200;
  --color-glazed-chestnut-700: #785a00;
  --color-glazed-chestnut-800: #5e4600;
  --color-glazed-chestnut-900: #483500;
  --color-glazed-chestnut-950: #2e2000;
  --color-trippy-velvet: #d11af3;
  --color-trippy-velvet-50: #fdf1ff;
  --color-trippy-velvet-100: #fae4ff;
  --color-trippy-velvet-200: #f5c7ff;
  --color-trippy-velvet-300: #eea2ff;
  --color-trippy-velvet-400: #e365ff;
  --color-trippy-velvet-500: #d11af3;
  --color-trippy-velvet-600: #ab00c8;
  --color-trippy-velvet-700: #8900a0;
  --color-trippy-velvet-800: #6c007f;
  --color-trippy-velvet-900: #540063;
  --color-trippy-velvet-950: #360041;
  --color-fresh-blue-of-bel-air: #00a1ef;
  --color-fresh-blue-of-bel-air-50: #e5f4ff;
  --color-fresh-blue-of-bel-air-100: #cfeaff;
  --color-fresh-blue-of-bel-air-200: #a3d8ff;
  --color-fresh-blue-of-bel-air-300: #6ac2ff;
  --color-fresh-blue-of-bel-air-400: #00a1ef;
  --color-fresh-blue-of-bel-air-500: #0086c8;
  --color-fresh-blue-of-bel-air-600: #006ca3;
  --color-fresh-blue-of-bel-air-700: #005683;
  --color-fresh-blue-of-bel-air-800: #004468;
  --color-fresh-blue-of-bel-air-900: #003553;
  --color-fresh-blue-of-bel-air-950: #002237;
  --color-seaweed: #00d47e;
  --color-seaweed-50: #c1ffd6;
  --color-seaweed-100: #97fbbe;
  --color-seaweed-200: #6de8a1;
  --color-seaweed-300: #00d47e;
  --color-seaweed-400: #00b269;
  --color-seaweed-500: #009557;
  --color-seaweed-600: #007946;
  --color-seaweed-700: #006237;
  --color-seaweed-800: #004e2b;
  --color-seaweed-900: #003e21;
  --color-seaweed-950: #002713;
  --color-lilac: #c5adff;
  --color-lilac-50: #f4f1ff;
  --color-lilac-100: #ebe4ff;
  --color-lilac-200: #d9cbff;
  --color-lilac-300: #c5adff;
  --color-lilac-400: #a68fdc;
  --color-lilac-500: #8c74c1;
  --color-lilac-600: #725aa3;
  --color-lilac-700: #5b4588;
  --color-lilac-800: #48346f;
  --color-lilac-900: #382759;
  --color-lilac-950: #23173a;
}