Rich Black to Snowy Mint Color Palette

About this palette

Rich Black to Snowy Mint is a 5-color cool, earthy palette: #003B33 (Rich Black), #336816 (Enchanted Glen), #8BC9AB (Irish Spring), #00A2A1 (Silken Jade), #D6EEC7 (Snowy Mint). It mixes turquoise, green tones and feels cool overall. The strongest text pairing is #003B33 on #D6EEC7 with a contrast ratio of 10.11:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Rich Black	rgb(0, 59, 51)	hsl(172, 100%, 12%)
Enchanted Glen	rgb(51, 104, 22)	hsl(99, 65%, 25%)
Irish Spring	rgb(139, 201, 171)	hsl(151, 36%, 67%)
Silken Jade	rgb(0, 162, 161)	hsl(180, 100%, 32%)
Snowy Mint	rgb(214, 238, 199)	hsl(97, 53%, 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.

Aa10.11:1 Very good#003B33 on #D6EEC7
Aa10.11:1 Very good#D6EEC7 on #003B33
Aa6.60:1 Good#003B33 on #8BC9AB
Aa6.60:1 Good#8BC9AB on #003B33
Aa5.40:1 Good#336816 on #D6EEC7
Aa5.40:1 Good#D6EEC7 on #336816
Aa3.99:1 Poor#003B33 on #00A2A1
Aa3.99:1 Poor#00A2A1 on #003B33

Color blindness preview

CSS variables

/* Rich Black to Snowy Mint — https://swatchly.xyz/palette/003b33-336816-8bc9ab-00a2a1-d6eec7 */
:root {
  --rich-black: #003b33;
  --enchanted-glen: #336816;
  --irish-spring: #8bc9ab;
  --silken-jade: #00a2a1;
  --snowy-mint: #d6eec7;
}

Tailwind CSS v4

/* Rich Black to Snowy Mint — https://swatchly.xyz/palette/003b33-336816-8bc9ab-00a2a1-d6eec7 */
@theme {
  --color-rich-black: #003b33;
  --color-rich-black-50: #e0fdf6;
  --color-rich-black-100: #d3f3ec;
  --color-rich-black-200: #bae1d9;
  --color-rich-black-300: #9fccc2;
  --color-rich-black-400: #7bada3;
  --color-rich-black-500: #5e9187;
  --color-rich-black-600: #44766d;
  --color-rich-black-700: #305e56;
  --color-rich-black-800: #214a42;
  --color-rich-black-900: #003b33;
  --color-rich-black-950: #0a231f;
  --color-enchanted-glen: #336816;
  --color-enchanted-glen-50: #e3ffd9;
  --color-enchanted-glen-100: #d3f8c5;
  --color-enchanted-glen-200: #bce7ab;
  --color-enchanted-glen-300: #a2d38e;
  --color-enchanted-glen-400: #7fb569;
  --color-enchanted-glen-500: #639a4b;
  --color-enchanted-glen-600: #4a7f31;
  --color-enchanted-glen-700: #336816;
  --color-enchanted-glen-800: #26520e;
  --color-enchanted-glen-900: #1a3f04;
  --color-enchanted-glen-950: #0d2801;
  --color-irish-spring: #8bc9ab;
  --color-irish-spring-50: #d7fbe9;
  --color-irish-spring-100: #c9f1dc;
  --color-irish-spring-200: #aedec6;
  --color-irish-spring-300: #8bc9ab;
  --color-irish-spring-400: #6faa8e;
  --color-irish-spring-500: #539074;
  --color-irish-spring-600: #3b765c;
  --color-irish-spring-700: #285f48;
  --color-irish-spring-800: #1b4c37;
  --color-irish-spring-900: #113c2a;
  --color-irish-spring-950: #072619;
  --color-silken-jade: #00a2a1;
  --color-silken-jade-50: #dbfffe;
  --color-silken-jade-100: #bafdfb;
  --color-silken-jade-200: #9cedeb;
  --color-silken-jade-300: #79d9d7;
  --color-silken-jade-400: #46bcbb;
  --color-silken-jade-500: #00a2a1;
  --color-silken-jade-600: #008282;
  --color-silken-jade-700: #006767;
  --color-silken-jade-800: #005150;
  --color-silken-jade-900: #003e3d;
  --color-silken-jade-950: #002626;
  --color-snowy-mint: #d6eec7;
  --color-snowy-mint-50: #e7f5de;
  --color-snowy-mint-100: #d6eec7;
  --color-snowy-mint-200: #c7d9bc;
  --color-snowy-mint-300: #b0c4a4;
  --color-snowy-mint-400: #91a783;
  --color-snowy-mint-500: #778c69;
  --color-snowy-mint-600: #5e7250;
  --color-snowy-mint-700: #495c3d;
  --color-snowy-mint-800: #38482d;
  --color-snowy-mint-900: #2a3821;
  --color-snowy-mint-950: #192312;
}