Start generating

Polar Expedition to Midnight Pines color palette

C9E6DFPolar Expedition7FCBC4CyantificBB7F86Old Rose766184Muted Purple3F4517Alligator Gladiator1F220EMidnight Pines
Open in generator Export PNG, PDF, ASE…

About this palette

Polar Expedition to Midnight Pines is a 6-color muted palette: #C9E6DF (Polar Expedition), #7FCBC4 (Cyantific), #BB7F86 (Old Rose), #766184 (Muted Purple), #3F4517 (Alligator Gladiator), #1F220E (Midnight Pines). It mixes gray, turquoise, red, purple, green tones and feels cool overall. The strongest text pairing is #C9E6DF on #1F220E with a contrast ratio of 12.27:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Polar Expeditionrgb(201, 230, 223)hsl(166, 37%, 85%)
Cyantificrgb(127, 203, 196)hsl(174, 42%, 65%)
Old Rosergb(187, 127, 134)hsl(353, 31%, 62%)
Muted Purplergb(118, 97, 132)hsl(276, 15%, 45%)
Alligator Gladiatorrgb(63, 69, 23)hsl(68, 50%, 18%)
Midnight Pinesrgb(31, 34, 14)hsl(69, 42%, 9%)

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.

  • Aa12.27:1 Super#C9E6DF on #1F220E
  • Aa12.27:1 Super#1F220E on #C9E6DF
  • Aa8.69:1 Very good#7FCBC4 on #1F220E
  • Aa8.69:1 Very good#1F220E on #7FCBC4
  • Aa7.65:1 Very good#C9E6DF on #3F4517
  • Aa7.65:1 Very good#3F4517 on #C9E6DF
  • Aa5.42:1 Good#7FCBC4 on #3F4517
  • Aa5.42:1 Good#3F4517 on #7FCBC4

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Polar Expedition to Midnight Pines — https://swatchly.xyz/palette/c9e6df-7fcbc4-bb7f86-766184-3f4517-1f220e */
:root {
  --polar-expedition: #c9e6df;
  --cyantific: #7fcbc4;
  --old-rose: #bb7f86;
  --muted-purple: #766184;
  --alligator-gladiator: #3f4517;
  --midnight-pines: #1f220e;
}

Tailwind CSS v4

/* Polar Expedition to Midnight Pines — https://swatchly.xyz/palette/c9e6df-7fcbc4-bb7f86-766184-3f4517-1f220e */
@theme {
  --color-polar-expedition: #c9e6df;
  --color-polar-expedition-50: #effefa;
  --color-polar-expedition-100: #e5f6f1;
  --color-polar-expedition-200: #c9e6df;
  --color-polar-expedition-300: #b5cdc7;
  --color-polar-expedition-400: #92ada6;
  --color-polar-expedition-500: #75908a;
  --color-polar-expedition-600: #5a746e;
  --color-polar-expedition-700: #445c57;
  --color-polar-expedition-800: #334743;
  --color-polar-expedition-900: #263733;
  --color-polar-expedition-950: #16221f;
  --color-cyantific: #7fcbc4;
  --color-cyantific-50: #d2fcf7;
  --color-cyantific-100: #c2f2ed;
  --color-cyantific-200: #a6dfd9;
  --color-cyantific-300: #7fcbc4;
  --color-cyantific-400: #63aca5;
  --color-cyantific-500: #45918b;
  --color-cyantific-600: #2a7771;
  --color-cyantific-700: #15605b;
  --color-cyantific-800: #044c48;
  --color-cyantific-900: #003c38;
  --color-cyantific-950: #002523;
  --color-old-rose: #bb7f86;
  --color-old-rose-50: #fff4f5;
  --color-old-rose-100: #ffe9eb;
  --color-old-rose-200: #ffd0d5;
  --color-old-rose-300: #eebabf;
  --color-old-rose-400: #d49aa0;
  --color-old-rose-500: #bb7f86;
  --color-old-rose-600: #9c636a;
  --color-old-rose-700: #7f4b52;
  --color-old-rose-800: #66383e;
  --color-old-rose-900: #4f292e;
  --color-old-rose-950: #33171b;
  --color-muted-purple: #766184;
  --color-muted-purple-50: #f9f2ff;
  --color-muted-purple-100: #f3e4fd;
  --color-muted-purple-200: #e1cfed;
  --color-muted-purple-300: #cbb7d9;
  --color-muted-purple-400: #ac97bb;
  --color-muted-purple-500: #917ba0;
  --color-muted-purple-600: #766184;
  --color-muted-purple-700: #5e4c6b;
  --color-muted-purple-800: #4a3a55;
  --color-muted-purple-900: #3a2c43;
  --color-muted-purple-950: #241a2b;
  --color-alligator-gladiator: #3f4517;
  --color-alligator-gladiator-50: #f3f9dd;
  --color-alligator-gladiator-100: #e9efd0;
  --color-alligator-gladiator-200: #d5dcb7;
  --color-alligator-gladiator-300: #bec69c;
  --color-alligator-gladiator-400: #9ea678;
  --color-alligator-gladiator-500: #838b5b;
  --color-alligator-gladiator-600: #687042;
  --color-alligator-gladiator-700: #52582f;
  --color-alligator-gladiator-800: #3f4517;
  --color-alligator-gladiator-900: #303516;
  --color-alligator-gladiator-950: #1d200a;
  --color-midnight-pines: #1f220e;
  --color-midnight-pines-50: #f4f7e9;
  --color-midnight-pines-100: #eaeddd;
  --color-midnight-pines-200: #d6dac7;
  --color-midnight-pines-300: #bfc4ae;
  --color-midnight-pines-400: #a0a48d;
  --color-midnight-pines-500: #858972;
  --color-midnight-pines-600: #6b6f58;
  --color-midnight-pines-700: #545844;
  --color-midnight-pines-800: #424533;
  --color-midnight-pines-900: #333526;
  --color-midnight-pines-950: #1f220e;
}

Similar palettes