Savoury Salmon to Crown of Thorns color palette

About this palette

Savoury Salmon to Crown of Thorns is a 5-color cool, vintage palette: #CD9896 (Savoury Salmon), #0A2F36 (Elite Teal), #CCF4FF (Vaporised), #058C97 (Turkish Jade), #7A3D36 (Crown of Thorns). It mixes red, turquoise, white tones and feels cool overall. The strongest text pairing is #0A2F36 on #CCF4FF with a contrast ratio of 12.19:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Savoury Salmonrgb(205, 152, 150)hsl(2, 35%, 70%)
Elite Tealrgb(10, 47, 54)hsl(190, 69%, 13%)
Vaporisedrgb(204, 244, 255)hsl(193, 100%, 90%)
Turkish Jadergb(5, 140, 151)hsl(185, 94%, 31%)
Crown of Thornsrgb(122, 61, 54)hsl(6, 39%, 35%)

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.19:1 Super#0A2F36 on #CCF4FF
  • Aa12.19:1 Super#CCF4FF on #0A2F36
  • Aa7.04:1 Very good#CCF4FF on #7A3D36
  • Aa7.04:1 Very good#7A3D36 on #CCF4FF
  • Aa5.79:1 Good#CD9896 on #0A2F36
  • Aa5.79:1 Good#0A2F36 on #CD9896
  • Aa3.53:1 Poor#0A2F36 on #058C97
  • Aa3.53:1 Poor#058C97 on #0A2F36

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Savoury Salmon to Crown of Thorns — https://swatchly.xyz/palette/cd9896-0a2f36-ccf4ff-058c97-7a3d36 */
:root {
  --savoury-salmon: #cd9896;
  --elite-teal: #0a2f36;
  --vaporised: #ccf4ff;
  --turkish-jade: #058c97;
  --crown-of-thorns: #7a3d36;
}

Tailwind CSS v4

/* Savoury Salmon to Crown of Thorns — https://swatchly.xyz/palette/cd9896-0a2f36-ccf4ff-058c97-7a3d36 */
@theme {
  --color-savoury-salmon: #cd9896;
  --color-savoury-salmon-50: #fff4f4;
  --color-savoury-salmon-100: #ffe8e7;
  --color-savoury-salmon-200: #f9d0cf;
  --color-savoury-salmon-300: #e7b9b7;
  --color-savoury-salmon-400: #cd9896;
  --color-savoury-salmon-500: #af7c7a;
  --color-savoury-salmon-600: #91615f;
  --color-savoury-salmon-700: #764a49;
  --color-savoury-salmon-800: #5e3837;
  --color-savoury-salmon-900: #492929;
  --color-savoury-salmon-950: #2f1818;
  --color-elite-teal: #0a2f36;
  --color-elite-teal-50: #e4fafe;
  --color-elite-teal-100: #d8f0f6;
  --color-elite-teal-200: #c1dde4;
  --color-elite-teal-300: #a7c8cf;
  --color-elite-teal-400: #83a7af;
  --color-elite-teal-500: #658a92;
  --color-elite-teal-600: #4a6d75;
  --color-elite-teal-700: #35545b;
  --color-elite-teal-800: #253f45;
  --color-elite-teal-900: #0a2f36;
  --color-elite-teal-950: #0c1b1e;
  --color-vaporised: #ccf4ff;
  --color-vaporised-50: #e7faff;
  --color-vaporised-100: #ccf4ff;
  --color-vaporised-200: #c1dee6;
  --color-vaporised-300: #a7c8d1;
  --color-vaporised-400: #85a9b3;
  --color-vaporised-500: #688d97;
  --color-vaporised-600: #4f727c;
  --color-vaporised-700: #3a5b64;
  --color-vaporised-800: #2b474f;
  --color-vaporised-900: #1f373d;
  --color-vaporised-950: #112227;
  --color-turkish-jade: #058c97;
  --color-turkish-jade-50: #d7fbff;
  --color-turkish-jade-100: #b5f4fb;
  --color-turkish-jade-200: #94e1e9;
  --color-turkish-jade-300: #70cad4;
  --color-turkish-jade-400: #3fa9b4;
  --color-turkish-jade-500: #058c97;
  --color-turkish-jade-600: #00717a;
  --color-turkish-jade-700: #005a61;
  --color-turkish-jade-800: #00474d;
  --color-turkish-jade-900: #00373c;
  --color-turkish-jade-950: #002327;
  --color-crown-of-thorns: #7a3d36;
  --color-crown-of-thorns-50: #fff2f0;
  --color-crown-of-thorns-100: #ffe4e0;
  --color-crown-of-thorns-200: #ffc7bf;
  --color-crown-of-thorns-300: #ecaea5;
  --color-crown-of-thorns-400: #ce8c82;
  --color-crown-of-thorns-500: #b16f66;
  --color-crown-of-thorns-600: #93554d;
  --color-crown-of-thorns-700: #7a3d36;
  --color-crown-of-thorns-800: #5f2f2a;
  --color-crown-of-thorns-900: #4b231e;
  --color-crown-of-thorns-950: #311411;
}

Similar palettes