Night Snow to Glazed Chestnut color palette

AACBFFNight Snow 002702PCB Green 63345FOpulent Purple 5A92E5Olympic Blue 927300Glazed Chestnut

About this palette

Night Snow to Glazed Chestnut is a 5-color cool palette: #AACBFF (Night Snow), #002702 (PCB Green), #63345F (Opulent Purple), #5A92E5 (Olympic Blue), #927300 (Glazed Chestnut). It mixes blue, green, purple, yellow tones and feels cool overall. The strongest text pairing is #AACBFF on #002702 with a contrast ratio of 9.83:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Night Snow	rgb(170, 203, 255)	hsl(217, 100%, 83%)
PCB Green	rgb(0, 39, 2)	hsl(123, 100%, 8%)
Opulent Purple	rgb(99, 52, 95)	hsl(305, 31%, 30%)
Olympic Blue	rgb(90, 146, 229)	hsl(216, 73%, 63%)
Glazed Chestnut	rgb(146, 115, 0)	hsl(47, 100%, 29%)

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.

Aa9.83:1 Very good#AACBFF on #002702
Aa9.83:1 Very good#002702 on #AACBFF
Aa5.81:1 Good#AACBFF on #63345F
Aa5.81:1 Good#63345F on #AACBFF
Aa5.17:1 Good#002702 on #5A92E5
Aa5.17:1 Good#5A92E5 on #002702
Aa3.62:1 Poor#002702 on #927300
Aa3.62:1 Poor#927300 on #002702

Color blindness preview

CSS variables

/* Night Snow to Glazed Chestnut — https://swatchly.xyz/palette/aacbff-002702-63345f-5a92e5-927300 */
:root {
  --night-snow: #aacbff;
  --pcb-green: #002702;
  --opulent-purple: #63345f;
  --olympic-blue: #5a92e5;
  --glazed-chestnut: #927300;
}

Tailwind CSS v4

/* Night Snow to Glazed Chestnut — https://swatchly.xyz/palette/aacbff-002702-63345f-5a92e5-927300 */
@theme {
  --color-night-snow: #aacbff;
  --color-night-snow-50: #f6faff;
  --color-night-snow-100: #e9f2ff;
  --color-night-snow-200: #cce0ff;
  --color-night-snow-300: #aacbff;
  --color-night-snow-400: #8caad9;
  --color-night-snow-500: #6e8cbd;
  --color-night-snow-600: #53709f;
  --color-night-snow-700: #3e5882;
  --color-night-snow-800: #2d4468;
  --color-night-snow-900: #203351;
  --color-night-snow-950: #111f35;
  --color-pcb-green: #002702;
  --color-pcb-green-50: #e5fde3;
  --color-pcb-green-100: #d9f4d7;
  --color-pcb-green-200: #c2e2c0;
  --color-pcb-green-300: #a8cda6;
  --color-pcb-green-400: #86ae84;
  --color-pcb-green-500: #6a9268;
  --color-pcb-green-600: #50774f;
  --color-pcb-green-700: #3b5f3a;
  --color-pcb-green-800: #2b4b2b;
  --color-pcb-green-900: #1f3a1f;
  --color-pcb-green-950: #002702;
  --color-opulent-purple: #63345f;
  --color-opulent-purple-50: #fff0fd;
  --color-opulent-purple-100: #ffe0fb;
  --color-opulent-purple-200: #f2c8ed;
  --color-opulent-purple-300: #e0b0da;
  --color-opulent-purple-400: #c390be;
  --color-opulent-purple-500: #a975a3;
  --color-opulent-purple-600: #8e5c89;
  --color-opulent-purple-700: #754871;
  --color-opulent-purple-800: #63345f;
  --color-opulent-purple-900: #4c2948;
  --color-opulent-purple-950: #31182f;
  --color-olympic-blue: #5a92e5;
  --color-olympic-blue-50: #f3f8ff;
  --color-olympic-blue-100: #e6f0ff;
  --color-olympic-blue-200: #cae0ff;
  --color-olympic-blue-300: #a8cbff;
  --color-olympic-blue-400: #77adfc;
  --color-olympic-blue-500: #5a92e5;
  --color-olympic-blue-600: #3e74c4;
  --color-olympic-blue-700: #285ba5;
  --color-olympic-blue-800: #184586;
  --color-olympic-blue-900: #0d346b;
  --color-olympic-blue-950: #041f46;
  --color-glazed-chestnut: #927300;
  --color-glazed-chestnut-50: #fff5d9;
  --color-glazed-chestnut-100: #ffecba;
  --color-glazed-chestnut-200: #f1da9c;
  --color-glazed-chestnut-300: #e0c57d;
  --color-glazed-chestnut-400: #c5a652;
  --color-glazed-chestnut-500: #ac8c2f;
  --color-glazed-chestnut-600: #927300;
  --color-glazed-chestnut-700: #745b00;
  --color-glazed-chestnut-800: #5b4700;
  --color-glazed-chestnut-900: #463600;
  --color-glazed-chestnut-950: #2c2100;
}