Terrestrial to British Racing Green color palette

About this palette

Terrestrial to British Racing Green is a 5-color cool palette: #006C59 (Terrestrial), #0EA059 (Shamrock), #00DBC4 (Ice Climber), #00B3C2 (Glassmith), #084B13 (British Racing Green). It mixes turquoise, green tones and feels cool overall. The strongest text pairing is #00DBC4 on #084B13 with a contrast ratio of 5.89:1, and 1 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Terrestrialrgb(0, 108, 89)hsl(169, 100%, 21%)
Shamrockrgb(14, 160, 89)hsl(151, 84%, 34%)
Ice Climberrgb(0, 219, 196)hsl(174, 100%, 43%)
Glassmithrgb(0, 179, 194)hsl(185, 100%, 38%)
British Racing Greenrgb(8, 75, 19)hsl(130, 81%, 16%)

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.

  • Aa5.89:1 Good#00DBC4 on #084B13
  • Aa5.89:1 Good#084B13 on #00DBC4
  • Aa4.06:1 Poor#00B3C2 on #084B13
  • Aa4.06:1 Poor#084B13 on #00B3C2
  • Aa3.63:1 Poor#006C59 on #00DBC4
  • Aa3.63:1 Poor#00DBC4 on #006C59
  • Aa3.06:1 Poor#0EA059 on #084B13
  • Aa3.06:1 Poor#084B13 on #0EA059

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Terrestrial to British Racing Green — https://swatchly.xyz/palette/006c59-0ea059-00dbc4-00b3c2-084b13 */
:root {
  --terrestrial: #006c59;
  --shamrock: #0ea059;
  --ice-climber: #00dbc4;
  --glassmith: #00b3c2;
  --british-racing-green: #084b13;
}

Tailwind CSS v4

/* Terrestrial to British Racing Green — https://swatchly.xyz/palette/006c59-0ea059-00dbc4-00b3c2-084b13 */
@theme {
  --color-terrestrial: #006c59;
  --color-terrestrial-50: #d9fff3;
  --color-terrestrial-100: #c6f8e9;
  --color-terrestrial-200: #ace8d6;
  --color-terrestrial-300: #8ed4c1;
  --color-terrestrial-400: #67b7a2;
  --color-terrestrial-500: #479d88;
  --color-terrestrial-600: #2a826f;
  --color-terrestrial-700: #006c59;
  --color-terrestrial-800: #005545;
  --color-terrestrial-900: #004135;
  --color-terrestrial-950: #002921;
  --color-shamrock: #0ea059;
  --color-shamrock-50: #deffe7;
  --color-shamrock-100: #b9ffce;
  --color-shamrock-200: #9aeeb5;
  --color-shamrock-300: #77da9a;
  --color-shamrock-400: #46bc76;
  --color-shamrock-500: #0ea059;
  --color-shamrock-600: #008146;
  --color-shamrock-700: #006736;
  --color-shamrock-800: #005129;
  --color-shamrock-900: #003e1e;
  --color-shamrock-950: #002711;
  --color-ice-climber: #00dbc4;
  --color-ice-climber-50: #d0fff6;
  --color-ice-climber-100: #a2fded;
  --color-ice-climber-200: #7aecda;
  --color-ice-climber-300: #00dbc4;
  --color-ice-climber-400: #00b8a4;
  --color-ice-climber-500: #009989;
  --color-ice-climber-600: #007c6e;
  --color-ice-climber-700: #006257;
  --color-ice-climber-800: #004d44;
  --color-ice-climber-900: #003c35;
  --color-ice-climber-950: #002621;
  --color-glassmith: #00b3c2;
  --color-glassmith-50: #dbfbff;
  --color-glassmith-100: #b5f7ff;
  --color-glassmith-200: #8ae7f2;
  --color-glassmith-300: #61d1de;
  --color-glassmith-400: #00b3c2;
  --color-glassmith-500: #0095a2;
  --color-glassmith-600: #007883;
  --color-glassmith-700: #006068;
  --color-glassmith-800: #004b52;
  --color-glassmith-900: #003a40;
  --color-glassmith-950: #002529;
  --color-british-racing-green: #084b13;
  --color-british-racing-green-50: #e1ffe0;
  --color-british-racing-green-100: #d0f8d0;
  --color-british-racing-green-200: #b7e6b8;
  --color-british-racing-green-300: #9bd09b;
  --color-british-racing-green-400: #75b177;
  --color-british-racing-green-500: #57945a;
  --color-british-racing-green-600: #3d7840;
  --color-british-racing-green-700: #295f2d;
  --color-british-racing-green-800: #084b13;
  --color-british-racing-green-900: #113814;
  --color-british-racing-green-950: #072309;
}

Similar palettes