Glossy Black to Sea of Galilee Color Palette

About this palette

Glossy Black to Sea of Galilee is a 4-color dark, cool palette: #0F0021 (Glossy Black), #263F48 (Depths of the Nile), #320542 (Dark Purple), #446394 (Sea of Galilee). It mixes purple, gray, blue tones and feels cool overall. The strongest text pairing is #0F0021 on #446394 with a contrast ratio of 3.32:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Glossy Black	rgb(15, 0, 33)	hsl(267, 100%, 6%)
Depths of the Nile	rgb(38, 63, 72)	hsl(196, 31%, 22%)
Dark Purple	rgb(50, 5, 66)	hsl(284, 86%, 14%)
Sea of Galilee	rgb(68, 99, 148)	hsl(217, 37%, 42%)

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.

Aa3.32:1 Poor#0F0021 on #446394
Aa3.32:1 Poor#446394 on #0F0021

Color blindness preview

CSS variables

/* Glossy Black to Sea of Galilee — https://swatchly.xyz/palette/0f0021-263f48-320542-446394 */
:root {
  --glossy-black: #0f0021;
  --depths-of-the-nile: #263f48;
  --dark-purple: #320542;
  --sea-of-galilee: #446394;
}

Tailwind CSS v4

/* Glossy Black to Sea of Galilee — https://swatchly.xyz/palette/0f0021-263f48-320542-446394 */
@theme {
  --color-glossy-black: #0f0021;
  --color-glossy-black-50: #f7f3ff;
  --color-glossy-black-100: #efe6ff;
  --color-glossy-black-200: #ded0f6;
  --color-glossy-black-300: #c8b8e3;
  --color-glossy-black-400: #a998c7;
  --color-glossy-black-500: #8977a6;
  --color-glossy-black-600: #695884;
  --color-glossy-black-700: #4e3f64;
  --color-glossy-black-800: #362a47;
  --color-glossy-black-900: #22192e;
  --color-glossy-black-950: #0f0021;
  --color-depths-of-the-nile: #263f48;
  --color-depths-of-the-nile-50: #e8f8ff;
  --color-depths-of-the-nile-100: #ddeff6;
  --color-depths-of-the-nile-200: #c6dce4;
  --color-depths-of-the-nile-300: #acc4cd;
  --color-depths-of-the-nile-400: #89a4ae;
  --color-depths-of-the-nile-500: #6c8791;
  --color-depths-of-the-nile-600: #516b74;
  --color-depths-of-the-nile-700: #3c535b;
  --color-depths-of-the-nile-800: #263f48;
  --color-depths-of-the-nile-900: #1f3036;
  --color-depths-of-the-nile-950: #111d21;
  --color-dark-purple: #320542;
  --color-dark-purple-50: #faf1ff;
  --color-dark-purple-100: #f6e3ff;
  --color-dark-purple-200: #ecc8fd;
  --color-dark-purple-300: #d8afeb;
  --color-dark-purple-400: #ba8dcf;
  --color-dark-purple-500: #9f71b3;
  --color-dark-purple-600: #835896;
  --color-dark-purple-700: #6a437c;
  --color-dark-purple-800: #553264;
  --color-dark-purple-900: #42254f;
  --color-dark-purple-950: #320542;
  --color-sea-of-galilee: #446394;
  --color-sea-of-galilee-50: #f0f6ff;
  --color-sea-of-galilee-100: #ddeaff;
  --color-sea-of-galilee-200: #bbd6ff;
  --color-sea-of-galilee-300: #9fbded;
  --color-sea-of-galilee-400: #7b9cd0;
  --color-sea-of-galilee-500: #5f7fb2;
  --color-sea-of-galilee-600: #446394;
  --color-sea-of-galilee-700: #334e78;
  --color-sea-of-galilee-800: #263d61;
  --color-sea-of-galilee-900: #1b2f4e;
  --color-sea-of-galilee-950: #0f1d33;
}