Green Dynasty to Cyantific color palette

00998EGreen Dynasty 004745Tropical Forest 6EF5F7Frozen Turquoise 006762Peacock Pride 7CCBC9Cyantific

Open in generator Export PNG, PDF, ASE…

About this palette

Green Dynasty to Cyantific is a 5-color cool, monochromatic palette: #00998E (Green Dynasty), #004745 (Tropical Forest), #6EF5F7 (Frozen Turquoise), #006762 (Peacock Pride), #7CCBC9 (Cyantific). It mixes turquoise tones and feels cool overall. The strongest text pairing is #004745 on #6EF5F7 with a contrast ratio of 8.09:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Green Dynasty	rgb(0, 153, 142)	hsl(176, 100%, 30%)
Tropical Forest	rgb(0, 71, 69)	hsl(178, 100%, 14%)
Frozen Turquoise	rgb(110, 245, 247)	hsl(181, 90%, 70%)
Peacock Pride	rgb(0, 103, 98)	hsl(177, 100%, 20%)
Cyantific	rgb(124, 203, 201)	hsl(178, 43%, 64%)

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.

Aa8.09:1 Very good#004745 on #6EF5F7
Aa8.09:1 Very good#6EF5F7 on #004745
Aa5.66:1 Good#004745 on #7CCBC9
Aa5.66:1 Good#7CCBC9 on #004745
Aa5.16:1 Good#6EF5F7 on #006762
Aa5.16:1 Good#006762 on #6EF5F7
Aa3.61:1 Poor#006762 on #7CCBC9
Aa3.61:1 Poor#7CCBC9 on #006762

Color blindness preview

CSS variables

/* Green Dynasty to Cyantific — https://swatchly.xyz/palette/00998e-004745-6ef5f7-006762-7ccbc9 */
:root {
  --green-dynasty: #00998e;
  --tropical-forest: #004745;
  --frozen-turquoise: #6ef5f7;
  --peacock-pride: #006762;
  --cyantific: #7ccbc9;
}

Tailwind CSS v4

/* Green Dynasty to Cyantific — https://swatchly.xyz/palette/00998e-004745-6ef5f7-006762-7ccbc9 */
@theme {
  --color-green-dynasty: #00998e;
  --color-green-dynasty-50: #d5fff9;
  --color-green-dynasty-100: #b8faf1;
  --color-green-dynasty-200: #98e8de;
  --color-green-dynasty-300: #74d3c8;
  --color-green-dynasty-400: #41b5aa;
  --color-green-dynasty-500: #00998e;
  --color-green-dynasty-600: #007b72;
  --color-green-dynasty-700: #00625b;
  --color-green-dynasty-800: #004d47;
  --color-green-dynasty-900: #003b37;
  --color-green-dynasty-950: #002522;
  --color-tropical-forest: #004745;
  --color-tropical-forest-50: #dcfdfb;
  --color-tropical-forest-100: #cff4f1;
  --color-tropical-forest-200: #b6e2df;
  --color-tropical-forest-300: #98cbc8;
  --color-tropical-forest-400: #73aca9;
  --color-tropical-forest-500: #548f8c;
  --color-tropical-forest-600: #3a7370;
  --color-tropical-forest-700: #265a58;
  --color-tropical-forest-800: #004745;
  --color-tropical-forest-900: #0d3534;
  --color-tropical-forest-950: #052120;
  --color-frozen-turquoise: #6ef5f7;
  --color-frozen-turquoise-50: #e4ffff;
  --color-frozen-turquoise-100: #baffff;
  --color-frozen-turquoise-200: #6ef5f7;
  --color-frozen-turquoise-300: #6fd9db;
  --color-frozen-turquoise-400: #31babc;
  --color-frozen-turquoise-500: #009c9e;
  --color-frozen-turquoise-600: #007d7f;
  --color-frozen-turquoise-700: #006364;
  --color-frozen-turquoise-800: #004d4e;
  --color-frozen-turquoise-900: #003b3c;
  --color-frozen-turquoise-950: #002526;
  --color-peacock-pride: #006762;
  --color-peacock-pride-50: #d6fffb;
  --color-peacock-pride-100: #c6f7f2;
  --color-peacock-pride-200: #ace5e0;
  --color-peacock-pride-300: #8ed1cb;
  --color-peacock-pride-400: #67b3ad;
  --color-peacock-pride-500: #479893;
  --color-peacock-pride-600: #2a7e78;
  --color-peacock-pride-700: #006762;
  --color-peacock-pride-800: #00514d;
  --color-peacock-pride-900: #003e3b;
  --color-peacock-pride-950: #002725;
  --color-cyantific: #7ccbc9;
  --color-cyantific-50: #d1fcfa;
  --color-cyantific-100: #c1f2f0;
  --color-cyantific-200: #a4dfdd;
  --color-cyantific-300: #7ccbc9;
  --color-cyantific-400: #60acaa;
  --color-cyantific-500: #419190;
  --color-cyantific-600: #257776;
  --color-cyantific-700: #0e605f;
  --color-cyantific-800: #004c4b;
  --color-cyantific-900: #003b3b;
  --color-cyantific-950: #002525;
}