Dark Olive to Frost Fairy Color Palette

About this palette

Dark Olive to Frost Fairy is a 4-color palette: #443C00 (Dark Olive), #00816A (Shadows of Time), #EA5275 (Lick and Kiss), #B9D0FF (Frost Fairy). It mixes brown, turquoise, red, blue tones and feels balanced overall. The strongest text pairing is #443C00 on #B9D0FF with a contrast ratio of 7.15:1, and 1 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dark Olive	rgb(68, 60, 0)	hsl(53, 100%, 13%)
Shadows of Time	rgb(0, 129, 106)	hsl(169, 100%, 25%)
Lick and Kiss	rgb(234, 82, 117)	hsl(346, 78%, 62%)
Frost Fairy	rgb(185, 208, 255)	hsl(220, 100%, 86%)

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.15:1 Very good#443C00 on #B9D0FF
Aa7.15:1 Very good#B9D0FF on #443C00
Aa3.15:1 Poor#443C00 on #EA5275
Aa3.15:1 Poor#EA5275 on #443C00
Aa3.11:1 Poor#00816A on #B9D0FF
Aa3.11:1 Poor#B9D0FF on #00816A

Color blindness preview

CSS variables

/* Dark Olive to Frost Fairy — https://swatchly.xyz/palette/443c00-00816a-ea5275-b9d0ff */
:root {
  --dark-olive: #443c00;
  --shadows-of-time: #00816a;
  --lick-and-kiss: #ea5275;
  --frost-fairy: #b9d0ff;
}

Tailwind CSS v4

/* Dark Olive to Frost Fairy — https://swatchly.xyz/palette/443c00-00816a-ea5275-b9d0ff */
@theme {
  --color-dark-olive: #443c00;
  --color-dark-olive-50: #fbf7d8;
  --color-dark-olive-100: #f1edca;
  --color-dark-olive-200: #dfd9b0;
  --color-dark-olive-300: #c8c192;
  --color-dark-olive-400: #a8a16c;
  --color-dark-olive-500: #8c844e;
  --color-dark-olive-600: #706835;
  --color-dark-olive-700: #575021;
  --color-dark-olive-800: #443c00;
  --color-dark-olive-900: #332e0b;
  --color-dark-olive-950: #1f1c04;
  --color-shadows-of-time: #00816a;
  --color-shadows-of-time-50: #d9fff3;
  --color-shadows-of-time-100: #c1fae9;
  --color-shadows-of-time-200: #a4e9d5;
  --color-shadows-of-time-300: #84d5be;
  --color-shadows-of-time-400: #59b79f;
  --color-shadows-of-time-500: #339c84;
  --color-shadows-of-time-600: #00816a;
  --color-shadows-of-time-700: #006754;
  --color-shadows-of-time-800: #005041;
  --color-shadows-of-time-900: #003e32;
  --color-shadows-of-time-950: #00271e;
  --color-lick-and-kiss: #ea5275;
  --color-lick-and-kiss-50: #fff4f5;
  --color-lick-and-kiss-100: #ffe8eb;
  --color-lick-and-kiss-200: #ffced4;
  --color-lick-and-kiss-300: #ffaeb9;
  --color-lick-and-kiss-400: #ff7892;
  --color-lick-and-kiss-500: #ea5275;
  --color-lick-and-kiss-600: #c7315a;
  --color-lick-and-kiss-700: #a61344;
  --color-lick-and-kiss-800: #860032;
  --color-lick-and-kiss-900: #680025;
  --color-lick-and-kiss-950: #430015;
  --color-frost-fairy: #b9d0ff;
  --color-frost-fairy-50: #e9f0ff;
  --color-frost-fairy-100: #d8e5ff;
  --color-frost-fairy-200: #b9d0ff;
  --color-frost-fairy-300: #a7bbe3;
  --color-frost-fairy-400: #889dc8;
  --color-frost-fairy-500: #6e82ae;
  --color-frost-fairy-600: #566992;
  --color-frost-fairy-700: #425478;
  --color-frost-fairy-800: #324262;
  --color-frost-fairy-900: #25324e;
  --color-frost-fairy-950: #161f32;
}