Neptune to Sea Serpent Color Palette

About this palette

Neptune to Sea Serpent is a 4-color vibrant, cool palette: #0081AB (Neptune), #DF3860 (Intense Passion), #69C800 (Blinking Terminal), #00CEDE (Sea Serpent). It mixes blue, red, green, turquoise tones and feels cool overall. The strongest text pairing is #0081AB on #00CEDE with a contrast ratio of 2.30:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Neptune	rgb(0, 129, 171)	hsl(195, 100%, 34%)
Intense Passion	rgb(223, 56, 96)	hsl(346, 72%, 55%)
Blinking Terminal	rgb(105, 200, 0)	hsl(88, 100%, 39%)
Sea Serpent	rgb(0, 206, 222)	hsl(184, 100%, 44%)

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.

Color blindness preview

CSS variables

/* Neptune to Sea Serpent — https://swatchly.xyz/palette/0081ab-df3860-69c800-00cede */
:root {
  --neptune: #0081ab;
  --intense-passion: #df3860;
  --blinking-terminal: #69c800;
  --sea-serpent: #00cede;
}

Tailwind CSS v4

/* Neptune to Sea Serpent — https://swatchly.xyz/palette/0081ab-df3860-69c800-00cede */
@theme {
  --color-neptune: #0081ab;
  --color-neptune-50: #eaf8ff;
  --color-neptune-100: #d8f2ff;
  --color-neptune-200: #afe4ff;
  --color-neptune-300: #84d2f8;
  --color-neptune-400: #59b5df;
  --color-neptune-500: #349bc6;
  --color-neptune-600: #0081ab;
  --color-neptune-700: #006689;
  --color-neptune-800: #00506b;
  --color-neptune-900: #003d53;
  --color-neptune-950: #002635;
  --color-intense-passion: #df3860;
  --color-intense-passion-50: #fff0f1;
  --color-intense-passion-100: #ffe1e3;
  --color-intense-passion-200: #ffc3c9;
  --color-intense-passion-300: #ff9da9;
  --color-intense-passion-400: #fe5d7c;
  --color-intense-passion-500: #df3860;
  --color-intense-passion-600: #be1348;
  --color-intense-passion-700: #9b0037;
  --color-intense-passion-800: #7b002a;
  --color-intense-passion-900: #610020;
  --color-intense-passion-950: #400012;
  --color-blinking-terminal: #69c800;
  --color-blinking-terminal-50: #efffe6;
  --color-blinking-terminal-100: #d8ffc3;
  --color-blinking-terminal-200: #b3f58c;
  --color-blinking-terminal-300: #96e366;
  --color-blinking-terminal-400: #69c800;
  --color-blinking-terminal-500: #56a600;
  --color-blinking-terminal-600: #448600;
  --color-blinking-terminal-700: #346a00;
  --color-blinking-terminal-800: #275200;
  --color-blinking-terminal-900: #1c3e00;
  --color-blinking-terminal-950: #0f2600;
  --color-sea-serpent: #00cede;
  --color-sea-serpent-50: #cbfaff;
  --color-sea-serpent-100: #9cf5ff;
  --color-sea-serpent-200: #71e2ef;
  --color-sea-serpent-300: #00cede;
  --color-sea-serpent-400: #00adbb;
  --color-sea-serpent-500: #00919c;
  --color-sea-serpent-600: #00757f;
  --color-sea-serpent-700: #005e66;
  --color-sea-serpent-800: #004a51;
  --color-sea-serpent-900: #003b40;
  --color-sea-serpent-950: #002528;
}