Nightly Voyager to Dolly Cheek color palette

37193BNightly Voyager 0089AACorfu Waters DF8658Copperhead 006323Woodland Wonder FFC8AEDolly Cheek

About this palette

Nightly Voyager to Dolly Cheek is a 5-color cool, earthy palette: #37193B (Nightly Voyager), #0089AA (Corfu Waters), #DF8658 (Copperhead), #006323 (Woodland Wonder), #FFC8AE (Dolly Cheek). It mixes purple, blue, orange, green tones and feels cool overall. The strongest text pairing is #37193B on #FFC8AE with a contrast ratio of 10.35:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Nightly Voyager	rgb(55, 25, 59)	hsl(293, 40%, 16%)
Corfu Waters	rgb(0, 137, 170)	hsl(192, 100%, 33%)
Copperhead	rgb(223, 134, 88)	hsl(20, 68%, 61%)
Woodland Wonder	rgb(0, 99, 35)	hsl(141, 100%, 19%)
Dolly Cheek	rgb(255, 200, 174)	hsl(19, 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.

Aa10.35:1 Very good#37193B on #FFC8AE
Aa10.35:1 Very good#FFC8AE on #37193B
Aa5.63:1 Good#37193B on #DF8658
Aa5.63:1 Good#DF8658 on #37193B
Aa5.03:1 Good#006323 on #FFC8AE
Aa5.03:1 Good#FFC8AE on #006323
Aa3.78:1 Poor#37193B on #0089AA
Aa3.78:1 Poor#0089AA on #37193B

Color blindness preview

CSS variables

/* Nightly Voyager to Dolly Cheek — https://swatchly.xyz/palette/37193b-0089aa-df8658-006323-ffc8ae */
:root {
  --nightly-voyager: #37193b;
  --corfu-waters: #0089aa;
  --copperhead: #df8658;
  --woodland-wonder: #006323;
  --dolly-cheek: #ffc8ae;
}

Tailwind CSS v4

/* Nightly Voyager to Dolly Cheek — https://swatchly.xyz/palette/37193b-0089aa-df8658-006323-ffc8ae */
@theme {
  --color-nightly-voyager: #37193b;
  --color-nightly-voyager-50: #fef0ff;
  --color-nightly-voyager-100: #fae2fd;
  --color-nightly-voyager-200: #e9ccec;
  --color-nightly-voyager-300: #d5b4d8;
  --color-nightly-voyager-400: #b793bb;
  --color-nightly-voyager-500: #9d79a1;
  --color-nightly-voyager-600: #836187;
  --color-nightly-voyager-700: #6c4d70;
  --color-nightly-voyager-800: #583c5c;
  --color-nightly-voyager-900: #482f4b;
  --color-nightly-voyager-950: #37193b;
  --color-corfu-waters: #0089aa;
  --color-corfu-waters-50: #e3f7ff;
  --color-corfu-waters-100: #c5efff;
  --color-corfu-waters-200: #93dffa;
  --color-corfu-waters-300: #6ec7e6;
  --color-corfu-waters-400: #3da7c8;
  --color-corfu-waters-500: #0089aa;
  --color-corfu-waters-600: #006e8a;
  --color-corfu-waters-700: #00586e;
  --color-corfu-waters-800: #004557;
  --color-corfu-waters-900: #003645;
  --color-corfu-waters-950: #00222d;
  --color-copperhead: #df8658;
  --color-copperhead-50: #fff1eb;
  --color-copperhead-100: #ffe4d7;
  --color-copperhead-200: #ffc9af;
  --color-copperhead-300: #f9aa82;
  --color-copperhead-400: #df8658;
  --color-copperhead-500: #c16b3d;
  --color-copperhead-600: #a35122;
  --color-copperhead-700: #863c0c;
  --color-copperhead-800: #6c2c00;
  --color-copperhead-900: #552100;
  --color-copperhead-950: #371300;
  --color-woodland-wonder: #006323;
  --color-woodland-wonder-50: #e0ffe3;
  --color-woodland-wonder-100: #c9face;
  --color-woodland-wonder-200: #ade8b3;
  --color-woodland-wonder-300: #8ed397;
  --color-woodland-wonder-400: #66b472;
  --color-woodland-wonder-500: #479855;
  --color-woodland-wonder-600: #2a7b3c;
  --color-woodland-wonder-700: #006323;
  --color-woodland-wonder-800: #044d1b;
  --color-woodland-wonder-900: #003c12;
  --color-woodland-wonder-950: #002608;
  --color-dolly-cheek: #ffc8ae;
  --color-dolly-cheek-50: #fff1ea;
  --color-dolly-cheek-100: #ffe3d6;
  --color-dolly-cheek-200: #ffc8ae;
  --color-dolly-cheek-300: #e2b49e;
  --color-dolly-cheek-400: #c6947c;
  --color-dolly-cheek-500: #aa7860;
  --color-dolly-cheek-600: #8e5e47;
  --color-dolly-cheek-700: #744934;
  --color-dolly-cheek-800: #5d3825;
  --color-dolly-cheek-900: #492a1a;
  --color-dolly-cheek-950: #2f190d;
}