Start generating

Eternal Winter to Rich Black color palette

98F7FFEternal Winter00C6C7Sea Serpent008D93Dark Cyan006C6FAqua Obscura003E40Rich Black
Open in generator Export PNG, PDF, ASE…

About this palette

Eternal Winter to Rich Black is a 5-color cool, monochromatic, gradient palette: #98F7FF (Eternal Winter), #00C6C7 (Sea Serpent), #008D93 (Dark Cyan), #006C6F (Aqua Obscura), #003E40 (Rich Black). It mixes turquoise tones and feels cool overall. The strongest text pairing is #98F7FF on #003E40 with a contrast ratio of 9.69:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Eternal Winterrgb(152, 247, 255)hsl(185, 100%, 80%)
Sea Serpentrgb(0, 198, 199)hsl(180, 100%, 39%)
Dark Cyanrgb(0, 141, 147)hsl(182, 100%, 29%)
Aqua Obscurargb(0, 108, 111)hsl(182, 100%, 22%)
Rich Blackrgb(0, 62, 64)hsl(182, 100%, 13%)

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.69:1 Very good#98F7FF on #003E40
  • Aa9.69:1 Very good#003E40 on #98F7FF
  • Aa5.62:1 Good#00C6C7 on #003E40
  • Aa5.62:1 Good#003E40 on #00C6C7
  • Aa5.06:1 Good#98F7FF on #006C6F
  • Aa5.06:1 Good#006C6F on #98F7FF
  • Aa3.27:1 Poor#98F7FF on #008D93
  • Aa3.27:1 Poor#008D93 on #98F7FF

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Eternal Winter to Rich Black — https://swatchly.xyz/palette/98f7ff-00c6c7-008d93-006c6f-003e40 */
:root {
  --eternal-winter: #98f7ff;
  --sea-serpent: #00c6c7;
  --dark-cyan: #008d93;
  --aqua-obscura: #006c6f;
  --rich-black: #003e40;
}

Tailwind CSS v4

/* Eternal Winter to Rich Black — https://swatchly.xyz/palette/98f7ff-00c6c7-008d93-006c6f-003e40 */
@theme {
  --color-eternal-winter: #98f7ff;
  --color-eternal-winter-50: #c7fbff;
  --color-eternal-winter-100: #98f7ff;
  --color-eternal-winter-200: #9be0e6;
  --color-eternal-winter-300: #7cccd3;
  --color-eternal-winter-400: #53afb6;
  --color-eternal-winter-500: #2f949c;
  --color-eternal-winter-600: #037a81;
  --color-eternal-winter-700: #006168;
  --color-eternal-winter-800: #004c51;
  --color-eternal-winter-900: #003b3f;
  --color-eternal-winter-950: #002528;
  --color-sea-serpent: #00c6c7;
  --color-sea-serpent-50: #e8ffff;
  --color-sea-serpent-100: #c3fffe;
  --color-sea-serpent-200: #96f3f2;
  --color-sea-serpent-300: #70e0e0;
  --color-sea-serpent-400: #00c6c7;
  --color-sea-serpent-500: #00a4a5;
  --color-sea-serpent-600: #008485;
  --color-sea-serpent-700: #006869;
  --color-sea-serpent-800: #005151;
  --color-sea-serpent-900: #003d3d;
  --color-sea-serpent-950: #002525;
  --color-dark-cyan: #008d93;
  --color-dark-cyan-50: #d2fdff;
  --color-dark-cyan-100: #b5f5f8;
  --color-dark-cyan-200: #94e2e6;
  --color-dark-cyan-300: #6fcbd0;
  --color-dark-cyan-400: #3daab0;
  --color-dark-cyan-500: #008d93;
  --color-dark-cyan-600: #007277;
  --color-dark-cyan-700: #005a5f;
  --color-dark-cyan-800: #00474b;
  --color-dark-cyan-900: #00383a;
  --color-dark-cyan-950: #002325;
  --color-aqua-obscura: #006c6f;
  --color-aqua-obscura-50: #d7feff;
  --color-aqua-obscura-100: #c4f6f7;
  --color-aqua-obscura-200: #abe6e8;
  --color-aqua-obscura-300: #8ed3d4;
  --color-aqua-obscura-400: #67b6b8;
  --color-aqua-obscura-500: #479c9f;
  --color-aqua-obscura-600: #2a8285;
  --color-aqua-obscura-700: #006c6f;
  --color-aqua-obscura-800: #005557;
  --color-aqua-obscura-900: #004143;
  --color-aqua-obscura-950: #00292b;
  --color-rich-black: #003e40;
  --color-rich-black-50: #defcfd;
  --color-rich-black-100: #d1f3f4;
  --color-rich-black-200: #b9e0e1;
  --color-rich-black-300: #9dcbcc;
  --color-rich-black-400: #7aadae;
  --color-rich-black-500: #5d9294;
  --color-rich-black-600: #447779;
  --color-rich-black-700: #306062;
  --color-rich-black-800: #214d4e;
  --color-rich-black-900: #003e40;
  --color-rich-black-950: #0a2627;
}

Similar palettes