Pollen to Elite Teal color palette

E7EAA6Pollen CAC668Salsa Verde 8475D3Matt Purple 7B4A4FNocturne Red 003433Elite Teal

About this palette

Pollen to Elite Teal is a 5-color warm, vintage palette: #E7EAA6 (Pollen), #CAC668 (Salsa Verde), #8475D3 (Matt Purple), #7B4A4F (Nocturne Red), #003433 (Elite Teal). It mixes yellow, purple, red, turquoise tones and feels warm overall. The strongest text pairing is #E7EAA6 on #003433 with a contrast ratio of 10.86:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pollen	rgb(231, 234, 166)	hsl(63, 62%, 78%)
Salsa Verde	rgb(202, 198, 104)	hsl(58, 48%, 60%)
Matt Purple	rgb(132, 117, 211)	hsl(250, 52%, 64%)
Nocturne Red	rgb(123, 74, 79)	hsl(354, 25%, 39%)
Elite Teal	rgb(0, 52, 51)	hsl(179, 100%, 10%)

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.86:1 Very good#E7EAA6 on #003433
Aa10.86:1 Very good#003433 on #E7EAA6
Aa7.66:1 Very good#CAC668 on #003433
Aa7.66:1 Very good#003433 on #CAC668
Aa5.70:1 Good#E7EAA6 on #7B4A4F
Aa5.70:1 Good#7B4A4F on #E7EAA6
Aa4.02:1 Poor#CAC668 on #7B4A4F
Aa4.02:1 Poor#7B4A4F on #CAC668

Color blindness preview

CSS variables

/* Pollen to Elite Teal — https://swatchly.xyz/palette/e7eaa6-cac668-8475d3-7b4a4f-003433 */
:root {
  --pollen: #e7eaa6;
  --salsa-verde: #cac668;
  --matt-purple: #8475d3;
  --nocturne-red: #7b4a4f;
  --elite-teal: #003433;
}

Tailwind CSS v4

/* Pollen to Elite Teal — https://swatchly.xyz/palette/e7eaa6-cac668-8475d3-7b4a4f-003433 */
@theme {
  --color-pollen: #e7eaa6;
  --color-pollen-50: #f1f3cc;
  --color-pollen-100: #e7eaa6;
  --color-pollen-200: #d4d6a3;
  --color-pollen-300: #bfc188;
  --color-pollen-400: #a1a364;
  --color-pollen-500: #878948;
  --color-pollen-600: #6e6f30;
  --color-pollen-700: #58591d;
  --color-pollen-800: #45450f;
  --color-pollen-900: #353506;
  --color-pollen-950: #212102;
  --color-salsa-verde: #cac668;
  --color-salsa-verde-50: #faf9c7;
  --color-salsa-verde-100: #f0efb7;
  --color-salsa-verde-200: #dedc99;
  --color-salsa-verde-300: #cac668;
  --color-salsa-verde-400: #aaa64c;
  --color-salsa-verde-500: #8f8a28;
  --color-salsa-verde-600: #746f00;
  --color-salsa-verde-700: #5c5800;
  --color-salsa-verde-800: #484500;
  --color-salsa-verde-900: #373500;
  --color-salsa-verde-950: #222100;
  --color-matt-purple: #8475d3;
  --color-matt-purple-50: #f4f4ff;
  --color-matt-purple-100: #eae8ff;
  --color-matt-purple-200: #d5d1ff;
  --color-matt-purple-300: #beb6ff;
  --color-matt-purple-400: #9f92ef;
  --color-matt-purple-500: #8475d3;
  --color-matt-purple-600: #6a5bb4;
  --color-matt-purple-700: #554596;
  --color-matt-purple-800: #42337b;
  --color-matt-purple-900: #332663;
  --color-matt-purple-950: #1f1642;
  --color-nocturne-red: #7b4a4f;
  --color-nocturne-red-50: #fff1f2;
  --color-nocturne-red-100: #ffe3e5;
  --color-nocturne-red-200: #f7cccf;
  --color-nocturne-red-300: #e5b4b8;
  --color-nocturne-red-400: #c99498;
  --color-nocturne-red-500: #ae797e;
  --color-nocturne-red-600: #926065;
  --color-nocturne-red-700: #7b4a4f;
  --color-nocturne-red-800: #61393d;
  --color-nocturne-red-900: #4d2a2e;
  --color-nocturne-red-950: #32191c;
  --color-elite-teal: #003433;
  --color-elite-teal-50: #e1fbfa;
  --color-elite-teal-100: #d4f2f1;
  --color-elite-teal-200: #bce0de;
  --color-elite-teal-300: #a2cac8;
  --color-elite-teal-400: #7daaa8;
  --color-elite-teal-500: #5f8e8c;
  --color-elite-teal-600: #457170;
  --color-elite-teal-700: #305957;
  --color-elite-teal-800: #214342;
  --color-elite-teal-900: #003433;
  --color-elite-teal-950: #0a1e1d;
}