Abyssal Waters to Bermuda color palette

About this palette

Abyssal Waters to Bermuda is a 5-color cool, vintage palette: #005A5E (Abyssal Waters), #FFC3BF (Piglet), #002528 (Sunken Ship), #E07683 (Turnip the Pink), #007D8D (Bermuda). It mixes turquoise, pink, red tones and feels cool overall. The strongest text pairing is #FFC3BF on #002528 with a contrast ratio of 10.66:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Abyssal Watersrgb(0, 90, 94)hsl(183, 100%, 18%)
Pigletrgb(255, 195, 191)hsl(4, 100%, 87%)
Sunken Shiprgb(0, 37, 40)hsl(184, 100%, 8%)
Turnip the Pinkrgb(224, 118, 131)hsl(353, 63%, 67%)
Bermudargb(0, 125, 141)hsl(187, 100%, 28%)

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.

  • Aa10.66:1 Very good#FFC3BF on #002528
  • Aa10.66:1 Very good#002528 on #FFC3BF
  • Aa5.47:1 Good#002528 on #E07683
  • Aa5.47:1 Good#E07683 on #002528
  • Aa5.26:1 Good#005A5E on #FFC3BF
  • Aa5.26:1 Good#FFC3BF on #005A5E
  • Aa3.33:1 Poor#002528 on #007D8D
  • Aa3.33:1 Poor#007D8D on #002528

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Abyssal Waters to Bermuda — https://swatchly.xyz/palette/005a5e-ffc3bf-002528-e07683-007d8d */
:root {
  --abyssal-waters: #005a5e;
  --piglet: #ffc3bf;
  --sunken-ship: #002528;
  --turnip-the-pink: #e07683;
  --bermuda: #007d8d;
}

Tailwind CSS v4

/* Abyssal Waters to Bermuda — https://swatchly.xyz/palette/005a5e-ffc3bf-002528-e07683-007d8d */
@theme {
  --color-abyssal-waters: #005a5e;
  --color-abyssal-waters-50: #d9fdff;
  --color-abyssal-waters-100: #c9f5f7;
  --color-abyssal-waters-200: #ade2e4;
  --color-abyssal-waters-300: #8ecbce;
  --color-abyssal-waters-400: #66abaf;
  --color-abyssal-waters-500: #468e92;
  --color-abyssal-waters-600: #2a7276;
  --color-abyssal-waters-700: #005a5e;
  --color-abyssal-waters-800: #064649;
  --color-abyssal-waters-900: #013639;
  --color-abyssal-waters-950: #002224;
  --color-piglet: #ffc3bf;
  --color-piglet-50: #ffeeed;
  --color-piglet-100: #ffe0de;
  --color-piglet-200: #ffc3bf;
  --color-piglet-300: #e3b0ac;
  --color-piglet-400: #c68f8c;
  --color-piglet-500: #ab7471;
  --color-piglet-600: #8e5b58;
  --color-piglet-700: #744644;
  --color-piglet-800: #5e3534;
  --color-piglet-900: #4a2826;
  --color-piglet-950: #301716;
  --color-sunken-ship: #002528;
  --color-sunken-ship-50: #e5fafc;
  --color-sunken-ship-100: #d9f1f3;
  --color-sunken-ship-200: #c1dee0;
  --color-sunken-ship-300: #a8c8cb;
  --color-sunken-ship-400: #85a9ac;
  --color-sunken-ship-500: #698e91;
  --color-sunken-ship-600: #507376;
  --color-sunken-ship-700: #3c5c5f;
  --color-sunken-ship-800: #2c484b;
  --color-sunken-ship-900: #1f383a;
  --color-sunken-ship-950: #002528;
  --color-turnip-the-pink: #e07683;
  --color-turnip-the-pink-50: #ffeeef;
  --color-turnip-the-pink-100: #ffdfe1;
  --color-turnip-the-pink-200: #ffc0c5;
  --color-turnip-the-pink-300: #fc9ca6;
  --color-turnip-the-pink-400: #e07683;
  --color-turnip-the-pink-500: #c25c6a;
  --color-turnip-the-pink-600: #a44352;
  --color-turnip-the-pink-700: #882f3e;
  --color-turnip-the-pink-800: #6e212f;
  --color-turnip-the-pink-900: #591623;
  --color-turnip-the-pink-950: #3b0b14;
  --color-bermuda: #007d8d;
  --color-bermuda-50: #e2faff;
  --color-bermuda-100: #c5f6ff;
  --color-bermuda-200: #a3e6f2;
  --color-bermuda-300: #83d1df;
  --color-bermuda-400: #58b3c3;
  --color-bermuda-500: #3398a8;
  --color-bermuda-600: #007d8d;
  --color-bermuda-700: #006370;
  --color-bermuda-800: #004e58;
  --color-bermuda-900: #003c44;
  --color-bermuda-950: #00252b;
}

Similar palettes