Aquarius to Resplendent Growth color palette

00B4C7Aquarius 004B23British Racing Green 002420Sunken Ship 44DFD1Jazzy Jade 2E8B3AResplendent Growth

Open in generator Export PNG, PDF, ASE…

About this palette

Aquarius to Resplendent Growth is a 5-color cool palette: #00B4C7 (Aquarius), #004B23 (British Racing Green), #002420 (Sunken Ship), #44DFD1 (Jazzy Jade), #2E8B3A (Resplendent Growth). It mixes turquoise, green tones and feels cool overall. The strongest text pairing is #002420 on #44DFD1 with a contrast ratio of 9.99:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Aquarius	rgb(0, 180, 199)	hsl(186, 100%, 39%)
British Racing Green	rgb(0, 75, 35)	hsl(148, 100%, 15%)
Sunken Ship	rgb(0, 36, 32)	hsl(173, 100%, 7%)
Jazzy Jade	rgb(68, 223, 209)	hsl(175, 71%, 57%)
Resplendent Growth	rgb(46, 139, 58)	hsl(128, 50%, 36%)

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.99:1 Very good#002420 on #44DFD1
Aa9.99:1 Very good#44DFD1 on #002420
Aa6.56:1 Good#00B4C7 on #002420
Aa6.56:1 Good#002420 on #00B4C7
Aa6.26:1 Good#004B23 on #44DFD1
Aa6.26:1 Good#44DFD1 on #004B23
Aa4.11:1 Poor#00B4C7 on #004B23
Aa4.11:1 Poor#004B23 on #00B4C7

Color blindness preview

CSS variables

/* Aquarius to Resplendent Growth — https://swatchly.xyz/palette/00b4c7-004b23-002420-44dfd1-2e8b3a */
:root {
  --aquarius: #00b4c7;
  --british-racing-green: #004b23;
  --sunken-ship: #002420;
  --jazzy-jade: #44dfd1;
  --resplendent-growth: #2e8b3a;
}

Tailwind CSS v4

/* Aquarius to Resplendent Growth — https://swatchly.xyz/palette/00b4c7-004b23-002420-44dfd1-2e8b3a */
@theme {
  --color-aquarius: #00b4c7;
  --color-aquarius-50: #dffbff;
  --color-aquarius-100: #bdf6ff;
  --color-aquarius-200: #8ae7f5;
  --color-aquarius-300: #62d2e3;
  --color-aquarius-400: #00b4c7;
  --color-aquarius-500: #0096a6;
  --color-aquarius-600: #007986;
  --color-aquarius-700: #00606b;
  --color-aquarius-800: #004b54;
  --color-aquarius-900: #003a41;
  --color-aquarius-950: #00252a;
  --color-british-racing-green: #004b23;
  --color-british-racing-green-50: #deffe6;
  --color-british-racing-green-100: #cff7d8;
  --color-british-racing-green-200: #b6e5c1;
  --color-british-racing-green-300: #98d0a7;
  --color-british-racing-green-400: #73b084;
  --color-british-racing-green-500: #549467;
  --color-british-racing-green-600: #3a774d;
  --color-british-racing-green-700: #265e39;
  --color-british-racing-green-800: #004b23;
  --color-british-racing-green-900: #0d381d;
  --color-british-racing-green-950: #052310;
  --color-sunken-ship: #002420;
  --color-sunken-ship-50: #e5faf7;
  --color-sunken-ship-100: #d9f1ed;
  --color-sunken-ship-200: #c2deda;
  --color-sunken-ship-300: #a9c9c3;
  --color-sunken-ship-400: #86aaa4;
  --color-sunken-ship-500: #6a8e89;
  --color-sunken-ship-600: #50736e;
  --color-sunken-ship-700: #3c5c57;
  --color-sunken-ship-800: #2c4743;
  --color-sunken-ship-900: #1f3733;
  --color-sunken-ship-950: #002420;
  --color-jazzy-jade: #44dfd1;
  --color-jazzy-jade-50: #defffa;
  --color-jazzy-jade-100: #b2fff5;
  --color-jazzy-jade-200: #8fefe4;
  --color-jazzy-jade-300: #44dfd1;
  --color-jazzy-jade-400: #1bbdb0;
  --color-jazzy-jade-500: #009d92;
  --color-jazzy-jade-600: #007f76;
  --color-jazzy-jade-700: #00645d;
  --color-jazzy-jade-800: #004e48;
  --color-jazzy-jade-900: #003c37;
  --color-jazzy-jade-950: #002622;
  --color-resplendent-growth: #2e8b3a;
  --color-resplendent-growth-50: #e0ffe1;
  --color-resplendent-growth-100: #c8fec9;
  --color-resplendent-growth-200: #aeeeb1;
  --color-resplendent-growth-300: #92db95;
  --color-resplendent-growth-400: #6bbf71;
  --color-resplendent-growth-500: #4ca554;
  --color-resplendent-growth-600: #2e8b3a;
  --color-resplendent-growth-700: #127024;
  --color-resplendent-growth-800: #005915;
  --color-resplendent-growth-900: #00440e;
  --color-resplendent-growth-950: #002b06;
}