Royal Neptune to High Dive Color Palette

About this palette

Royal Neptune to High Dive is a 4-color cool, monochromatic palette: #133A3E (Royal Neptune), #D5FAFF (Salt Mountain), #26787D (Prismarine), #43BECC (High Dive). It mixes turquoise, white tones and feels cool overall. The strongest text pairing is #133A3E on #D5FAFF with a contrast ratio of 11.13:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Royal Neptune	rgb(19, 58, 62)	hsl(186, 53%, 16%)
Salt Mountain	rgb(213, 250, 255)	hsl(187, 100%, 92%)
Prismarine	rgb(38, 120, 125)	hsl(183, 53%, 32%)
High Dive	rgb(67, 190, 204)	hsl(186, 57%, 53%)

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.

Aa11.13:1 Very good#133A3E on #D5FAFF
Aa11.13:1 Very good#D5FAFF on #133A3E
Aa5.57:1 Good#133A3E on #43BECC
Aa5.57:1 Good#43BECC on #133A3E
Aa4.66:1 Good#D5FAFF on #26787D
Aa4.66:1 Good#26787D on #D5FAFF

Color blindness preview

CSS variables

/* Royal Neptune to High Dive — https://swatchly.xyz/palette/133a3e-d5faff-26787d-43becc */
:root {
  --royal-neptune: #133a3e;
  --salt-mountain: #d5faff;
  --prismarine: #26787d;
  --high-dive: #43becc;
}

Tailwind CSS v4

/* Royal Neptune to High Dive — https://swatchly.xyz/palette/133a3e-d5faff-26787d-43becc */
@theme {
  --color-royal-neptune: #133a3e;
  --color-royal-neptune-50: #e4fafd;
  --color-royal-neptune-100: #d7f1f4;
  --color-royal-neptune-200: #c0dee1;
  --color-royal-neptune-300: #a6c8cc;
  --color-royal-neptune-400: #83aaae;
  --color-royal-neptune-500: #678e93;
  --color-royal-neptune-600: #4e7478;
  --color-royal-neptune-700: #3a5d60;
  --color-royal-neptune-800: #2a494c;
  --color-royal-neptune-900: #133a3e;
  --color-royal-neptune-950: #102325;
  --color-salt-mountain: #d5faff;
  --color-salt-mountain-50: #d5faff;
  --color-salt-mountain-100: #d7eef1;
  --color-salt-mountain-200: #c0dbdf;
  --color-salt-mountain-300: #a7c6ca;
  --color-salt-mountain-400: #86a8ac;
  --color-salt-mountain-500: #6b8d91;
  --color-salt-mountain-600: #527277;
  --color-salt-mountain-700: #3d5b5f;
  --color-salt-mountain-800: #2d474b;
  --color-salt-mountain-900: #21373a;
  --color-salt-mountain-950: #122224;
  --color-prismarine: #26787d;
  --color-prismarine-50: #dafdff;
  --color-prismarine-100: #c7f5f8;
  --color-prismarine-200: #abe3e7;
  --color-prismarine-300: #8dced2;
  --color-prismarine-400: #65afb4;
  --color-prismarine-500: #459398;
  --color-prismarine-600: #26787d;
  --color-prismarine-700: #116065;
  --color-prismarine-800: #004c50;
  --color-prismarine-900: #003a3e;
  --color-prismarine-950: #002527;
  --color-high-dive: #43becc;
  --color-high-dive-50: #eafdff;
  --color-high-dive-100: #cef9ff;
  --color-high-dive-200: #a1edf7;
  --color-high-dive-300: #7fdae5;
  --color-high-dive-400: #43becc;
  --color-high-dive-500: #14a0ad;
  --color-high-dive-600: #00818c;
  --color-high-dive-700: #00666f;
  --color-high-dive-800: #004f56;
  --color-high-dive-900: #003c42;
  --color-high-dive-950: #002529;
}