Silken Jade to Rich Black color palette

00A4A7Silken Jade 00C2D1Caribbean Blue 8FE7E6Aqua Fiesta 007C7DWizards Orb 004348Rich Black

About this palette

Silken Jade to Rich Black is a 5-color cool, monochromatic palette: #00A4A7 (Silken Jade), #00C2D1 (Caribbean Blue), #8FE7E6 (Aqua Fiesta), #007C7D (Wizards Orb), #004348 (Rich Black). It mixes turquoise tones and feels cool overall. The strongest text pairing is #8FE7E6 on #004348 with a contrast ratio of 7.77:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Silken Jade	rgb(0, 164, 167)	hsl(181, 100%, 33%)
Caribbean Blue	rgb(0, 194, 209)	hsl(184, 100%, 41%)
Aqua Fiesta	rgb(143, 231, 230)	hsl(179, 65%, 73%)
Wizards Orb	rgb(0, 124, 125)	hsl(180, 100%, 25%)
Rich Black	rgb(0, 67, 72)	hsl(184, 100%, 14%)

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.

Aa7.77:1 Very good#8FE7E6 on #004348
Aa7.77:1 Very good#004348 on #8FE7E6
Aa5.08:1 Good#00C2D1 on #004348
Aa5.08:1 Good#004348 on #00C2D1
Aa3.62:1 Poor#00A4A7 on #004348
Aa3.62:1 Poor#004348 on #00A4A7
Aa3.53:1 Poor#8FE7E6 on #007C7D
Aa3.53:1 Poor#007C7D on #8FE7E6

Color blindness preview

CSS variables

/* Silken Jade to Rich Black — https://swatchly.xyz/palette/00a4a7-00c2d1-8fe7e6-007c7d-004348 */
:root {
  --silken-jade: #00a4a7;
  --caribbean-blue: #00c2d1;
  --aqua-fiesta: #8fe7e6;
  --wizards-orb: #007c7d;
  --rich-black: #004348;
}

Tailwind CSS v4

/* Silken Jade to Rich Black — https://swatchly.xyz/palette/00a4a7-00c2d1-8fe7e6-007c7d-004348 */
@theme {
  --color-silken-jade: #00a4a7;
  --color-silken-jade-50: #ddffff;
  --color-silken-jade-100: #bbfdfe;
  --color-silken-jade-200: #9dedef;
  --color-silken-jade-300: #7adadc;
  --color-silken-jade-400: #48bec0;
  --color-silken-jade-500: #00a4a7;
  --color-silken-jade-600: #008487;
  --color-silken-jade-700: #00696b;
  --color-silken-jade-800: #005153;
  --color-silken-jade-900: #003e3f;
  --color-silken-jade-950: #002627;
  --color-caribbean-blue: #00c2d1;
  --color-caribbean-blue-50: #eafdff;
  --color-caribbean-blue-100: #cefaff;
  --color-caribbean-blue-200: #94f0fa;
  --color-caribbean-blue-300: #6edde9;
  --color-caribbean-blue-400: #00c2d1;
  --color-caribbean-blue-500: #00a1ae;
  --color-caribbean-blue-600: #00818c;
  --color-caribbean-blue-700: #00666f;
  --color-caribbean-blue-800: #004f56;
  --color-caribbean-blue-900: #003c42;
  --color-caribbean-blue-950: #002528;
  --color-aqua-fiesta: #8fe7e6;
  --color-aqua-fiesta-50: #cffefd;
  --color-aqua-fiesta-100: #c0f5f4;
  --color-aqua-fiesta-200: #8fe7e6;
  --color-aqua-fiesta-300: #85cecd;
  --color-aqua-fiesta-400: #5cb0af;
  --color-aqua-fiesta-500: #3a9595;
  --color-aqua-fiesta-600: #1a7a7a;
  --color-aqua-fiesta-700: #006262;
  --color-aqua-fiesta-800: #004d4d;
  --color-aqua-fiesta-900: #003b3b;
  --color-aqua-fiesta-950: #002525;
  --color-wizards-orb: #007c7d;
  --color-wizards-orb-50: #d4ffff;
  --color-wizards-orb-100: #c0f8f7;
  --color-wizards-orb-200: #a3e6e6;
  --color-wizards-orb-300: #83d1d1;
  --color-wizards-orb-400: #58b3b3;
  --color-wizards-orb-500: #339798;
  --color-wizards-orb-600: #007c7d;
  --color-wizards-orb-700: #006263;
  --color-wizards-orb-800: #004d4e;
  --color-wizards-orb-900: #003b3c;
  --color-wizards-orb-950: #002526;
  --color-rich-black: #004348;
  --color-rich-black-50: #ddfcff;
  --color-rich-black-100: #d0f3f6;
  --color-rich-black-200: #b7e1e4;
  --color-rich-black-300: #9bcbd0;
  --color-rich-black-400: #78aeb3;
  --color-rich-black-500: #5c9499;
  --color-rich-black-600: #437a7f;
  --color-rich-black-700: #306469;
  --color-rich-black-800: #215155;
  --color-rich-black-900: #004348;
  --color-rich-black-950: #0a2a2d;
}