Botanical Night to Paolo Veronese Green color palette

004336Botanical Night 27151EBlack Cherry EFBCDDRosecco 00BB94Slime Girl 804760Magician’s Cloak 1A9C77Paolo Veronese Green

Open in generator Export PNG, PDF, ASE…

About this palette

Botanical Night to Paolo Veronese Green is a 6-color palette: #004336 (Botanical Night), #27151E (Black Cherry), #EFBCDD (Rosecco), #00BB94 (Slime Girl), #804760 (Magician’s Cloak), #1A9C77 (Paolo Veronese Green). It mixes turquoise, gray, pink, red tones and feels cool overall. The strongest text pairing is #27151E on #EFBCDD with a contrast ratio of 10.65:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Botanical Night	rgb(0, 67, 54)	hsl(168, 100%, 13%)
Black Cherry	rgb(39, 21, 30)	hsl(330, 30%, 12%)
Rosecco	rgb(239, 188, 221)	hsl(321, 61%, 84%)
Slime Girl	rgb(0, 187, 148)	hsl(167, 100%, 37%)
Magician’s Cloak	rgb(128, 71, 96)	hsl(334, 29%, 39%)
Paolo Veronese Green	rgb(26, 156, 119)	hsl(163, 71%, 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.

Aa10.65:1 Very good#27151E on #EFBCDD
Aa10.65:1 Very good#EFBCDD on #27151E
Aa7.04:1 Very good#27151E on #00BB94
Aa7.04:1 Very good#00BB94 on #27151E
Aa6.95:1 Good#004336 on #EFBCDD
Aa6.95:1 Good#EFBCDD on #004336
Aa5.00:1 Good#27151E on #1A9C77
Aa5.00:1 Good#1A9C77 on #27151E

Color blindness preview

CSS variables

/* Botanical Night to Paolo Veronese Green — https://swatchly.xyz/palette/004336-27151e-efbcdd-00bb94-804760-1a9c77 */
:root {
  --botanical-night: #004336;
  --black-cherry: #27151e;
  --rosecco: #efbcdd;
  --slime-girl: #00bb94;
  --magician-s-cloak: #804760;
  --paolo-veronese-green: #1a9c77;
}

Tailwind CSS v4

/* Botanical Night to Paolo Veronese Green — https://swatchly.xyz/palette/004336-27151e-efbcdd-00bb94-804760-1a9c77 */
@theme {
  --color-botanical-night: #004336;
  --color-botanical-night-50: #defdf3;
  --color-botanical-night-100: #d1f4e9;
  --color-botanical-night-200: #b8e2d5;
  --color-botanical-night-300: #9ccdbe;
  --color-botanical-night-400: #79b0a0;
  --color-botanical-night-500: #5d9586;
  --color-botanical-night-600: #447b6c;
  --color-botanical-night-700: #306457;
  --color-botanical-night-800: #215145;
  --color-botanical-night-900: #004336;
  --color-botanical-night-950: #0a2a22;
  --color-black-cherry: #27151e;
  --color-black-cherry-50: #fff1f7;
  --color-black-cherry-100: #f6e6ed;
  --color-black-cherry-200: #e5d1da;
  --color-black-cherry-300: #d0bac4;
  --color-black-cherry-400: #b29aa5;
  --color-black-cherry-500: #957e89;
  --color-black-cherry-600: #79636d;
  --color-black-cherry-700: #604c56;
  --color-black-cherry-800: #4b3a42;
  --color-black-cherry-900: #392b31;
  --color-black-cherry-950: #27151e;
  --color-rosecco: #efbcdd;
  --color-rosecco-50: #ffe6f6;
  --color-rosecco-100: #fad7ed;
  --color-rosecco-200: #efbcdd;
  --color-rosecco-300: #d6aac6;
  --color-rosecco-400: #ba8ba9;
  --color-rosecco-500: #9f7190;
  --color-rosecco-600: #855976;
  --color-rosecco-700: #6d4560;
  --color-rosecco-800: #58354d;
  --color-rosecco-900: #45283b;
  --color-rosecco-950: #2c1725;
  --color-slime-girl: #00bb94;
  --color-slime-girl-50: #d8fff0;
  --color-slime-girl-100: #affee2;
  --color-slime-girl-200: #8bedcd;
  --color-slime-girl-300: #63d8b5;
  --color-slime-girl-400: #00bb94;
  --color-slime-girl-500: #009c7b;
  --color-slime-girl-600: #007e62;
  --color-slime-girl-700: #00644e;
  --color-slime-girl-800: #004e3c;
  --color-slime-girl-900: #003d2e;
  --color-slime-girl-950: #00261c;
  --color-magician-s-cloak: #804760;
  --color-magician-s-cloak-50: #fff1f6;
  --color-magician-s-cloak-100: #ffe2ed;
  --color-magician-s-cloak-200: #fbc9dc;
  --color-magician-s-cloak-300: #e9b1c7;
  --color-magician-s-cloak-400: #cd91a9;
  --color-magician-s-cloak-500: #b3768f;
  --color-magician-s-cloak-600: #975d76;
  --color-magician-s-cloak-700: #804760;
  --color-magician-s-cloak-800: #66364b;
  --color-magician-s-cloak-900: #50283a;
  --color-magician-s-cloak-950: #341724;
  --color-paolo-veronese-green: #1a9c77;
  --color-paolo-veronese-green-50: #daffef;
  --color-paolo-veronese-green-100: #bbfce1;
  --color-paolo-veronese-green-200: #9ceacc;
  --color-paolo-veronese-green-300: #79d6b3;
  --color-paolo-veronese-green-400: #4ab893;
  --color-paolo-veronese-green-500: #1a9c77;
  --color-paolo-veronese-green-600: #007f5f;
  --color-paolo-veronese-green-700: #00654b;
  --color-paolo-veronese-green-800: #004f3a;
  --color-paolo-veronese-green-900: #003d2c;
  --color-paolo-veronese-green-950: #00261a;
}