Calm Waters to Satin Deep Black color palette

E6F9F8Calm Waters D0A7A9La Vie en Rose A47375Equestrienne 365552Enchanting Ivy 16201FSatin Deep Black

Open in generator Export PNG, PDF, ASE…

About this palette

Calm Waters to Satin Deep Black is a 5-color muted, gradient palette: #E6F9F8 (Calm Waters), #D0A7A9 (La Vie en Rose), #A47375 (Equestrienne), #365552 (Enchanting Ivy), #16201F (Satin Deep Black). It mixes white, red, turquoise, gray tones and feels warm overall. The strongest text pairing is #E6F9F8 on #16201F with a contrast ratio of 15.29:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Calm Waters	rgb(230, 249, 248)	hsl(177, 61%, 94%)
La Vie en Rose	rgb(208, 167, 169)	hsl(357, 30%, 74%)
Equestrienne	rgb(164, 115, 117)	hsl(358, 21%, 55%)
Enchanting Ivy	rgb(54, 85, 82)	hsl(174, 22%, 27%)
Satin Deep Black	rgb(22, 32, 31)	hsl(174, 19%, 11%)

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.

Aa15.29:1 Super#E6F9F8 on #16201F
Aa15.29:1 Super#16201F on #E6F9F8
Aa7.76:1 Very good#D0A7A9 on #16201F
Aa7.76:1 Very good#16201F on #D0A7A9
Aa7.47:1 Very good#E6F9F8 on #365552
Aa7.47:1 Very good#365552 on #E6F9F8
Aa4.19:1 Poor#A47375 on #16201F
Aa4.19:1 Poor#16201F on #A47375

Color blindness preview

CSS variables

/* Calm Waters to Satin Deep Black — https://swatchly.xyz/palette/e6f9f8-d0a7a9-a47375-365552-16201f */
:root {
  --calm-waters: #e6f9f8;
  --la-vie-en-rose: #d0a7a9;
  --equestrienne: #a47375;
  --enchanting-ivy: #365552;
  --satin-deep-black: #16201f;
}

Tailwind CSS v4

/* Calm Waters to Satin Deep Black — https://swatchly.xyz/palette/e6f9f8-d0a7a9-a47375-365552-16201f */
@theme {
  --color-calm-waters: #e6f9f8;
  --color-calm-waters-50: #e6f9f8;
  --color-calm-waters-100: #e2eded;
  --color-calm-waters-200: #cddada;
  --color-calm-waters-300: #b5c4c3;
  --color-calm-waters-400: #94a5a4;
  --color-calm-waters-500: #798a89;
  --color-calm-waters-600: #5f706f;
  --color-calm-waters-700: #4a5958;
  --color-calm-waters-800: #384545;
  --color-calm-waters-900: #2a3535;
  --color-calm-waters-950: #192121;
  --color-la-vie-en-rose: #d0a7a9;
  --color-la-vie-en-rose-50: #ffe7e8;
  --color-la-vie-en-rose-100: #f7d9da;
  --color-la-vie-en-rose-200: #e4c2c3;
  --color-la-vie-en-rose-300: #d0a7a9;
  --color-la-vie-en-rose-400: #b28b8d;
  --color-la-vie-en-rose-500: #987274;
  --color-la-vie-en-rose-600: #7e5b5d;
  --color-la-vie-en-rose-700: #674749;
  --color-la-vie-en-rose-800: #54383a;
  --color-la-vie-en-rose-900: #432b2d;
  --color-la-vie-en-rose-950: #2b1a1b;
  --color-equestrienne: #a47375;
  --color-equestrienne-50: #fff0f1;
  --color-equestrienne-100: #ffe1e2;
  --color-equestrienne-200: #f3c9ca;
  --color-equestrienne-300: #dfb1b2;
  --color-equestrienne-400: #c18f91;
  --color-equestrienne-500: #a47375;
  --color-equestrienne-600: #885a5c;
  --color-equestrienne-700: #6f4648;
  --color-equestrienne-800: #593537;
  --color-equestrienne-900: #46282a;
  --color-equestrienne-950: #2d1819;
  --color-enchanting-ivy: #365552;
  --color-enchanting-ivy-50: #e7faf8;
  --color-enchanting-ivy-100: #dbf0ee;
  --color-enchanting-ivy-200: #c3dcd9;
  --color-enchanting-ivy-300: #a8c5c2;
  --color-enchanting-ivy-400: #85a5a2;
  --color-enchanting-ivy-500: #688985;
  --color-enchanting-ivy-600: #4e6d69;
  --color-enchanting-ivy-700: #365552;
  --color-enchanting-ivy-800: #2a4240;
  --color-enchanting-ivy-900: #1f3331;
  --color-enchanting-ivy-950: #111f1e;
  --color-satin-deep-black: #16201f;
  --color-satin-deep-black-50: #f0f7f6;
  --color-satin-deep-black-100: #e5edec;
  --color-satin-deep-black-200: #d0dad9;
  --color-satin-deep-black-300: #b9c4c2;
  --color-satin-deep-black-400: #98a4a3;
  --color-satin-deep-black-500: #7d8987;
  --color-satin-deep-black-600: #626e6d;
  --color-satin-deep-black-700: #4c5756;
  --color-satin-deep-black-800: #3a4342;
  --color-satin-deep-black-900: #2c3332;
  --color-satin-deep-black-950: #16201f;
}