Deadly Depths to Tadorna Teal color palette

17134EDeadly Depths 873B5DPleasure E20086Benevolent Pink 373B79Good Karma B39F00Martian 62D7B8Tadorna Teal

Open in generator Export PNG, PDF, ASE…

About this palette

Deadly Depths to Tadorna Teal is a 6-color palette: #17134E (Deadly Depths), #873B5D (Pleasure), #E20086 (Benevolent Pink), #373B79 (Good Karma), #B39F00 (Martian), #62D7B8 (Tadorna Teal). It mixes purple, red, yellow, turquoise tones and feels balanced overall. The strongest text pairing is #17134E on #62D7B8 with a contrast ratio of 9.63:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Deadly Depths	rgb(23, 19, 78)	hsl(244, 61%, 19%)
Pleasure	rgb(135, 59, 93)	hsl(333, 39%, 38%)
Benevolent Pink	rgb(226, 0, 134)	hsl(324, 100%, 44%)
Good Karma	rgb(55, 59, 121)	hsl(236, 37%, 35%)
Martian	rgb(179, 159, 0)	hsl(53, 100%, 35%)
Tadorna Teal	rgb(98, 215, 184)	hsl(164, 59%, 61%)

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.

Aa9.63:1 Very good#17134E on #62D7B8
Aa9.63:1 Very good#62D7B8 on #17134E
Aa6.35:1 Good#17134E on #B39F00
Aa6.35:1 Good#B39F00 on #17134E
Aa5.78:1 Good#373B79 on #62D7B8
Aa5.78:1 Good#62D7B8 on #373B79
Aa4.24:1 Poor#873B5D on #62D7B8
Aa4.24:1 Poor#62D7B8 on #873B5D

Color blindness preview

CSS variables

/* Deadly Depths to Tadorna Teal — https://swatchly.xyz/palette/17134e-873b5d-e20086-373b79-b39f00-62d7b8 */
:root {
  --deadly-depths: #17134e;
  --pleasure: #873b5d;
  --benevolent-pink: #e20086;
  --good-karma: #373b79;
  --martian: #b39f00;
  --tadorna-teal: #62d7b8;
}

Tailwind CSS v4

/* Deadly Depths to Tadorna Teal — https://swatchly.xyz/palette/17134e-873b5d-e20086-373b79-b39f00-62d7b8 */
@theme {
  --color-deadly-depths: #17134e;
  --color-deadly-depths-50: #f3f4ff;
  --color-deadly-depths-100: #e6eaff;
  --color-deadly-depths-200: #ced4ff;
  --color-deadly-depths-300: #b3bcfa;
  --color-deadly-depths-400: #939bdf;
  --color-deadly-depths-500: #787fc4;
  --color-deadly-depths-600: #5e65a6;
  --color-deadly-depths-700: #494e89;
  --color-deadly-depths-800: #383c6f;
  --color-deadly-depths-900: #2a2d59;
  --color-deadly-depths-950: #17134e;
  --color-pleasure: #873b5d;
  --color-pleasure-50: #fff1f6;
  --color-pleasure-100: #ffe2ed;
  --color-pleasure-200: #ffc6db;
  --color-pleasure-300: #f3a9c6;
  --color-pleasure-400: #d887a8;
  --color-pleasure-500: #bd6b8d;
  --color-pleasure-600: #9f5273;
  --color-pleasure-700: #873b5d;
  --color-pleasure-800: #6b2d49;
  --color-pleasure-900: #552038;
  --color-pleasure-950: #381123;
  --color-benevolent-pink: #e20086;
  --color-benevolent-pink-50: #ffeff4;
  --color-benevolent-pink-100: #ffdeea;
  --color-benevolent-pink-200: #ffbed6;
  --color-benevolent-pink-300: #ff96c0;
  --color-benevolent-pink-400: #ff4aa2;
  --color-benevolent-pink-500: #e20086;
  --color-benevolent-pink-600: #b8006c;
  --color-benevolent-pink-700: #930056;
  --color-benevolent-pink-800: #750043;
  --color-benevolent-pink-900: #5d0034;
  --color-benevolent-pink-950: #3e0020;
  --color-good-karma: #373b79;
  --color-good-karma-50: #f2f4ff;
  --color-good-karma-100: #e6eaff;
  --color-good-karma-200: #cdd5ff;
  --color-good-karma-300: #b3bcfa;
  --color-good-karma-400: #929ce0;
  --color-good-karma-500: #7780c4;
  --color-good-karma-600: #5e66a7;
  --color-good-karma-700: #494f8b;
  --color-good-karma-800: #373b79;
  --color-good-karma-900: #2a2e5a;
  --color-good-karma-950: #191c3b;
  --color-martian: #b39f00;
  --color-martian-50: #fff6bb;
  --color-martian-100: #f7eca4;
  --color-martian-200: #e5d780;
  --color-martian-300: #d0c058;
  --color-martian-400: #b39f00;
  --color-martian-500: #958400;
  --color-martian-600: #786a00;
  --color-martian-700: #605400;
  --color-martian-800: #4b4200;
  --color-martian-900: #3a3300;
  --color-martian-950: #251f00;
  --color-tadorna-teal: #62d7b8;
  --color-tadorna-teal-50: #d5fff1;
  --color-tadorna-teal-100: #b7fae5;
  --color-tadorna-teal-200: #97e9d0;
  --color-tadorna-teal-300: #62d7b8;
  --color-tadorna-teal-400: #44b699;
  --color-tadorna-teal-500: #0c9b7e;
  --color-tadorna-teal-600: #007d66;
  --color-tadorna-teal-700: #006450;
  --color-tadorna-teal-800: #004e3f;
  --color-tadorna-teal-900: #003d30;
  --color-tadorna-teal-950: #00261d;
}