Botanical Night to Kissed by Mist Color Palette

About this palette

Botanical Night to Kissed by Mist is a 4-color vintage palette: #00453C (Botanical Night), #8B597D (Plum Highness), #7EAD46 (Lost Golfer), #FFC9F6 (Kissed by Mist). It mixes turquoise, pink, green tones and feels balanced overall. The strongest text pairing is #00453C on #FFC9F6 with a contrast ratio of 7.79:1, and 1 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Botanical Night	rgb(0, 69, 60)	hsl(172, 100%, 14%)
Plum Highness	rgb(139, 89, 125)	hsl(317, 22%, 45%)
Lost Golfer	rgb(126, 173, 70)	hsl(87, 42%, 48%)
Kissed by Mist	rgb(255, 201, 246)	hsl(310, 100%, 89%)

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.79:1 Very good#00453C on #FFC9F6
Aa7.79:1 Very good#FFC9F6 on #00453C
Aa4.15:1 Poor#00453C on #7EAD46
Aa4.15:1 Poor#7EAD46 on #00453C
Aa3.91:1 Poor#8B597D on #FFC9F6
Aa3.91:1 Poor#FFC9F6 on #8B597D

Color blindness preview

CSS variables

/* Botanical Night to Kissed by Mist — https://swatchly.xyz/palette/00453c-8b597d-7ead46-ffc9f6 */
:root {
  --botanical-night: #00453c;
  --plum-highness: #8b597d;
  --lost-golfer: #7ead46;
  --kissed-by-mist: #ffc9f6;
}

Tailwind CSS v4

/* Botanical Night to Kissed by Mist — https://swatchly.xyz/palette/00453c-8b597d-7ead46-ffc9f6 */
@theme {
  --color-botanical-night: #00453c;
  --color-botanical-night-50: #ddfdf6;
  --color-botanical-night-100: #d0f4ec;
  --color-botanical-night-200: #b7e2d9;
  --color-botanical-night-300: #9bcdc2;
  --color-botanical-night-400: #78b0a5;
  --color-botanical-night-500: #5c968b;
  --color-botanical-night-600: #437c72;
  --color-botanical-night-700: #30665c;
  --color-botanical-night-800: #21534a;
  --color-botanical-night-900: #00453c;
  --color-botanical-night-950: #0a2b26;
  --color-plum-highness: #8b597d;
  --color-plum-highness-50: #fff0fa;
  --color-plum-highness-100: #ffe1f5;
  --color-plum-highness-200: #f3c9e6;
  --color-plum-highness-300: #e0b0d1;
  --color-plum-highness-400: #c38fb3;
  --color-plum-highness-500: #a77398;
  --color-plum-highness-600: #8b597d;
  --color-plum-highness-700: #714465;
  --color-plum-highness-800: #5a3350;
  --color-plum-highness-900: #47263e;
  --color-plum-highness-950: #2d1627;
  --color-lost-golfer: #7ead46;
  --color-lost-golfer-50: #e1ffc6;
  --color-lost-golfer-100: #d4f5b5;
  --color-lost-golfer-200: #bce296;
  --color-lost-golfer-300: #a1cc74;
  --color-lost-golfer-400: #7ead46;
  --color-lost-golfer-500: #649228;
  --color-lost-golfer-600: #4c7700;
  --color-lost-golfer-700: #3c5f00;
  --color-lost-golfer-800: #2e4b00;
  --color-lost-golfer-900: #233a00;
  --color-lost-golfer-950: #142500;
  --color-kissed-by-mist: #ffc9f6;
  --color-kissed-by-mist-50: #fff6fd;
  --color-kissed-by-mist-100: #ffe8fb;
  --color-kissed-by-mist-200: #ffc9f6;
  --color-kissed-by-mist-300: #e1b5da;
  --color-kissed-by-mist-400: #c393bb;
  --color-kissed-by-mist-500: #a7769f;
  --color-kissed-by-mist-600: #8a5b83;
  --color-kissed-by-mist-700: #6f4569;
  --color-kissed-by-mist-800: #583353;
  --color-kissed-by-mist-900: #452641;
  --color-kissed-by-mist-950: #2c1629;
}