Sereni Teal to Toxic Latte Color Palette

About this palette

Sereni Teal to Toxic Latte is a 4-color cool palette: #79BBA8 (Sereni Teal), #063034 (Elite Teal), #2E7C45 (Bold Irish), #E4FAE4 (Toxic Latte). It mixes turquoise, green, white tones and feels cool overall. The strongest text pairing is #063034 on #E4FAE4 with a contrast ratio of 12.90:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Sereni Teal	rgb(121, 187, 168)	hsl(163, 33%, 60%)
Elite Teal	rgb(6, 48, 52)	hsl(185, 79%, 11%)
Bold Irish	rgb(46, 124, 69)	hsl(138, 46%, 33%)
Toxic Latte	rgb(228, 250, 228)	hsl(120, 69%, 94%)

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.

Aa12.90:1 Super#063034 on #E4FAE4
Aa12.90:1 Super#E4FAE4 on #063034
Aa6.41:1 Good#79BBA8 on #063034
Aa6.41:1 Good#063034 on #79BBA8
Aa4.67:1 Good#2E7C45 on #E4FAE4
Aa4.67:1 Good#E4FAE4 on #2E7C45

Color blindness preview

CSS variables

/* Sereni Teal to Toxic Latte — https://swatchly.xyz/palette/79bba8-063034-2e7c45-e4fae4 */
:root {
  --sereni-teal: #79bba8;
  --elite-teal: #063034;
  --bold-irish: #2e7c45;
  --toxic-latte: #e4fae4;
}

Tailwind CSS v4

/* Sereni Teal to Toxic Latte — https://swatchly.xyz/palette/79bba8-063034-2e7c45-e4fae4 */
@theme {
  --color-sereni-teal: #79bba8;
  --color-sereni-teal-50: #e7fff7;
  --color-sereni-teal-100: #d4faee;
  --color-sereni-teal-200: #bceadc;
  --color-sereni-teal-300: #a2d7c7;
  --color-sereni-teal-400: #79bba8;
  --color-sereni-teal-500: #5c9d8b;
  --color-sereni-teal-600: #3f806f;
  --color-sereni-teal-700: #286657;
  --color-sereni-teal-800: #185043;
  --color-sereni-teal-900: #0c3d32;
  --color-sereni-teal-950: #04261e;
  --color-elite-teal: #063034;
  --color-elite-teal-50: #e3fafd;
  --color-elite-teal-100: #d7f1f4;
  --color-elite-teal-200: #bfdee2;
  --color-elite-teal-300: #a5c9cc;
  --color-elite-teal-400: #81a8ac;
  --color-elite-teal-500: #638b8f;
  --color-elite-teal-600: #486e72;
  --color-elite-teal-700: #335559;
  --color-elite-teal-800: #234043;
  --color-elite-teal-900: #063034;
  --color-elite-teal-950: #0b1b1d;
  --color-bold-irish: #2e7c45;
  --color-bold-irish-50: #dfffe4;
  --color-bold-irish-100: #caf9d2;
  --color-bold-irish-200: #afe7ba;
  --color-bold-irish-300: #91d29f;
  --color-bold-irish-400: #6ab47b;
  --color-bold-irish-500: #4b985f;
  --color-bold-irish-600: #2e7c45;
  --color-bold-irish-700: #1b6433;
  --color-bold-irish-800: #0c4f24;
  --color-bold-irish-900: #033d19;
  --color-bold-irish-950: #00270d;
  --color-toxic-latte: #e4fae4;
  --color-toxic-latte-50: #e4fae4;
  --color-toxic-latte-100: #e0eee0;
  --color-toxic-latte-200: #cbdbcb;
  --color-toxic-latte-300: #b4c6b4;
  --color-toxic-latte-400: #93a793;
  --color-toxic-latte-500: #788c78;
  --color-toxic-latte-600: #5f725f;
  --color-toxic-latte-700: #4a5b4a;
  --color-toxic-latte-800: #384738;
  --color-toxic-latte-900: #2a372a;
  --color-toxic-latte-950: #192219;
}