Martian Cerulean to Queen of Trees color palette

589379Martian Cerulean 9FCEAFLimestoned 00633AFicus Elastica DAF9E3Toxic Latte 1D3C26Queen of Trees

About this palette

Martian Cerulean to Queen of Trees is a 5-color cool, earthy, monochromatic palette: #589379 (Martian Cerulean), #9FCEAF (Limestoned), #00633A (Ficus Elastica), #DAF9E3 (Toxic Latte), #1D3C26 (Queen of Trees). It mixes green, white tones and feels cool overall. The strongest text pairing is #DAF9E3 on #1D3C26 with a contrast ratio of 10.80:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Martian Cerulean	rgb(88, 147, 121)	hsl(154, 25%, 46%)
Limestoned	rgb(159, 206, 175)	hsl(140, 32%, 72%)
Ficus Elastica	rgb(0, 99, 58)	hsl(155, 100%, 19%)
Toxic Latte	rgb(218, 249, 227)	hsl(137, 72%, 92%)
Queen of Trees	rgb(29, 60, 38)	hsl(137, 35%, 17%)

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.80:1 Very good#DAF9E3 on #1D3C26
Aa10.80:1 Very good#1D3C26 on #DAF9E3
Aa6.90:1 Good#9FCEAF on #1D3C26
Aa6.90:1 Good#1D3C26 on #9FCEAF
Aa6.55:1 Good#00633A on #DAF9E3
Aa6.55:1 Good#DAF9E3 on #00633A
Aa4.19:1 Poor#9FCEAF on #00633A
Aa4.19:1 Poor#00633A on #9FCEAF

Color blindness preview

CSS variables

/* Martian Cerulean to Queen of Trees — https://swatchly.xyz/palette/589379-9fceaf-00633a-daf9e3-1d3c26 */
:root {
  --martian-cerulean: #589379;
  --limestoned: #9fceaf;
  --ficus-elastica: #00633a;
  --toxic-latte: #daf9e3;
  --queen-of-trees: #1d3c26;
}

Tailwind CSS v4

/* Martian Cerulean to Queen of Trees — https://swatchly.xyz/palette/589379-9fceaf-00633a-daf9e3-1d3c26 */
@theme {
  --color-martian-cerulean: #589379;
  --color-martian-cerulean-50: #ddfeee;
  --color-martian-cerulean-100: #cff5e3;
  --color-martian-cerulean-200: #b6e3cd;
  --color-martian-cerulean-300: #9acdb5;
  --color-martian-cerulean-400: #76af95;
  --color-martian-cerulean-500: #589379;
  --color-martian-cerulean-600: #3e7860;
  --color-martian-cerulean-700: #2b604a;
  --color-martian-cerulean-800: #1c4c39;
  --color-martian-cerulean-900: #123b2b;
  --color-martian-cerulean-950: #07251a;
  --color-limestoned: #9fceaf;
  --color-limestoned-50: #e3fdeb;
  --color-limestoned-100: #d6f4e0;
  --color-limestoned-200: #bfe2ca;
  --color-limestoned-300: #9fceaf;
  --color-limestoned-400: #82ae91;
  --color-limestoned-500: #659275;
  --color-limestoned-600: #4c775c;
  --color-limestoned-700: #385f47;
  --color-limestoned-800: #284b36;
  --color-limestoned-900: #1c3a28;
  --color-limestoned-950: #0f2518;
  --color-ficus-elastica: #00633a;
  --color-ficus-elastica-50: #ddffe9;
  --color-ficus-elastica-100: #c9f9da;
  --color-ficus-elastica-200: #ade7c3;
  --color-ficus-elastica-300: #8ed2a9;
  --color-ficus-elastica-400: #67b387;
  --color-ficus-elastica-500: #47976a;
  --color-ficus-elastica-600: #2a7b51;
  --color-ficus-elastica-700: #00633a;
  --color-ficus-elastica-800: #034d2d;
  --color-ficus-elastica-900: #003c21;
  --color-ficus-elastica-950: #002613;
  --color-toxic-latte: #daf9e3;
  --color-toxic-latte-50: #eefef2;
  --color-toxic-latte-100: #daf9e3;
  --color-toxic-latte-200: #cce2d2;
  --color-toxic-latte-300: #b2cbb9;
  --color-toxic-latte-400: #90ac98;
  --color-toxic-latte-500: #73907c;
  --color-toxic-latte-600: #597461;
  --color-toxic-latte-700: #445c4b;
  --color-toxic-latte-800: #33483a;
  --color-toxic-latte-900: #26382b;
  --color-toxic-latte-950: #16231a;
  --color-queen-of-trees: #1d3c26;
  --color-queen-of-trees-50: #e7fbeb;
  --color-queen-of-trees-100: #dcf2e0;
  --color-queen-of-trees-200: #c5e0cb;
  --color-queen-of-trees-300: #accab2;
  --color-queen-of-trees-400: #8aac92;
  --color-queen-of-trees-500: #6f9077;
  --color-queen-of-trees-600: #55765d;
  --color-queen-of-trees-700: #415e48;
  --color-queen-of-trees-800: #314b37;
  --color-queen-of-trees-900: #1d3c26;
  --color-queen-of-trees-950: #152519;
}