Start generating

Abyssal Waters to Wisteria color palette

00575DAbyssal Waters008178Windows 95 Desktop4B3600Moelleux au ChocolatF2D199Sparkling ChampagneD0ACD9Blushing SkyAD7CC7Wisteria
Open in generator Export PNG, PDF, ASE…

About this palette

Abyssal Waters to Wisteria is a 6-color cool palette: #00575D (Abyssal Waters), #008178 (Windows 95 Desktop), #4B3600 (Moelleux au Chocolat), #F2D199 (Sparkling Champagne), #D0ACD9 (Blushing Sky), #AD7CC7 (Wisteria). It mixes turquoise, brown, yellow, purple tones and feels cool overall. The strongest text pairing is #4B3600 on #F2D199 with a contrast ratio of 7.86:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Abyssal Watersrgb(0, 87, 93)hsl(184, 100%, 18%)
Windows 95 Desktoprgb(0, 129, 120)hsl(176, 100%, 25%)
Moelleux au Chocolatrgb(75, 54, 0)hsl(43, 100%, 15%)
Sparkling Champagnergb(242, 209, 153)hsl(38, 77%, 77%)
Blushing Skyrgb(208, 172, 217)hsl(288, 37%, 76%)
Wisteriargb(173, 124, 199)hsl(279, 40%, 63%)

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.

  • Aa7.86:1 Very good#4B3600 on #F2D199
  • Aa7.86:1 Very good#F2D199 on #4B3600
  • Aa5.79:1 Good#4B3600 on #D0ACD9
  • Aa5.79:1 Good#D0ACD9 on #4B3600
  • Aa5.69:1 Good#00575D on #F2D199
  • Aa5.69:1 Good#F2D199 on #00575D
  • Aa4.20:1 Poor#00575D on #D0ACD9
  • Aa4.20:1 Poor#D0ACD9 on #00575D

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Abyssal Waters to Wisteria — https://swatchly.xyz/palette/00575d-008178-4b3600-f2d199-d0acd9-ad7cc7 */
:root {
  --abyssal-waters: #00575d;
  --windows-95-desktop: #008178;
  --moelleux-au-chocolat: #4b3600;
  --sparkling-champagne: #f2d199;
  --blushing-sky: #d0acd9;
  --wisteria: #ad7cc7;
}

Tailwind CSS v4

/* Abyssal Waters to Wisteria — https://swatchly.xyz/palette/00575d-008178-4b3600-f2d199-d0acd9-ad7cc7 */
@theme {
  --color-abyssal-waters: #00575d;
  --color-abyssal-waters-50: #dcfcff;
  --color-abyssal-waters-100: #caf4f8;
  --color-abyssal-waters-200: #ade1e5;
  --color-abyssal-waters-300: #8ecacf;
  --color-abyssal-waters-400: #66a9af;
  --color-abyssal-waters-500: #468c92;
  --color-abyssal-waters-600: #2a6f75;
  --color-abyssal-waters-700: #00575d;
  --color-abyssal-waters-800: #084348;
  --color-abyssal-waters-900: #023438;
  --color-abyssal-waters-950: #002023;
  --color-windows-95-desktop: #008178;
  --color-windows-95-desktop-50: #d6fff9;
  --color-windows-95-desktop-100: #c0f9f2;
  --color-windows-95-desktop-200: #a4e8e0;
  --color-windows-95-desktop-300: #84d4cb;
  --color-windows-95-desktop-400: #59b7ad;
  --color-windows-95-desktop-500: #349c92;
  --color-windows-95-desktop-600: #008178;
  --color-windows-95-desktop-700: #00665f;
  --color-windows-95-desktop-800: #00504a;
  --color-windows-95-desktop-900: #003e39;
  --color-windows-95-desktop-950: #002723;
  --color-moelleux-au-chocolat: #4b3600;
  --color-moelleux-au-chocolat-50: #fff4de;
  --color-moelleux-au-chocolat-100: #f9e9cb;
  --color-moelleux-au-chocolat-200: #e8d5b1;
  --color-moelleux-au-chocolat-300: #d3be94;
  --color-moelleux-au-chocolat-400: #b7a072;
  --color-moelleux-au-chocolat-500: #9d8656;
  --color-moelleux-au-chocolat-600: #836c3e;
  --color-moelleux-au-chocolat-700: #6c572b;
  --color-moelleux-au-chocolat-800: #58451d;
  --color-moelleux-au-chocolat-900: #4b3600;
  --color-moelleux-au-chocolat-950: #2f2308;
  --color-sparkling-champagne: #f2d199;
  --color-sparkling-champagne-50: #fff3de;
  --color-sparkling-champagne-100: #fce7c4;
  --color-sparkling-champagne-200: #f2d199;
  --color-sparkling-champagne-300: #d7bc8d;
  --color-sparkling-champagne-400: #ba9c68;
  --color-sparkling-champagne-500: #9f804b;
  --color-sparkling-champagne-600: #836631;
  --color-sparkling-champagne-700: #6b501e;
  --color-sparkling-champagne-800: #553e11;
  --color-sparkling-champagne-900: #432f07;
  --color-sparkling-champagne-950: #2a1c02;
  --color-blushing-sky: #d0acd9;
  --color-blushing-sky-50: #fbecff;
  --color-blushing-sky-100: #f5ddfb;
  --color-blushing-sky-200: #e3c7ea;
  --color-blushing-sky-300: #d0acd9;
  --color-blushing-sky-400: #b08fb9;
  --color-blushing-sky-500: #96749e;
  --color-blushing-sky-600: #7b5b83;
  --color-blushing-sky-700: #64476b;
  --color-blushing-sky-800: #503656;
  --color-blushing-sky-900: #3f2944;
  --color-blushing-sky-950: #28182c;
  --color-wisteria: #ad7cc7;
  --color-wisteria-50: #fbf5ff;
  --color-wisteria-100: #f7eaff;
  --color-wisteria-200: #efd2ff;
  --color-wisteria-300: #e1b8f7;
  --color-wisteria-400: #c697df;
  --color-wisteria-500: #ad7cc7;
  --color-wisteria-600: #8f5fa8;
  --color-wisteria-700: #74478a;
  --color-wisteria-800: #5c346f;
  --color-wisteria-900: #472657;
  --color-wisteria-950: #2d1538;
}

Similar palettes