Peppy Peacock to Botanical Night Color Palette

About this palette

Peppy Peacock to Botanical Night is a 4-color vintage palette: #3ACBC0 (Peppy Peacock), #B14C69 (Extravagant Blush), #FFD6DD (We Peep), #00443F (Botanical Night). It mixes turquoise, red, pink tones and feels balanced overall. The strongest text pairing is #FFD6DD on #00443F with a contrast ratio of 8.38:1, and 2 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Peppy Peacock	rgb(58, 203, 192)	hsl(175, 58%, 51%)
Extravagant Blush	rgb(177, 76, 105)	hsl(343, 40%, 50%)
We Peep	rgb(255, 214, 221)	hsl(350, 100%, 92%)
Botanical Night	rgb(0, 68, 63)	hsl(176, 100%, 13%)

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.

Aa8.38:1 Very good#FFD6DD on #00443F
Aa8.38:1 Very good#00443F on #FFD6DD
Aa5.52:1 Good#3ACBC0 on #00443F
Aa5.52:1 Good#00443F on #3ACBC0
Aa3.87:1 Poor#B14C69 on #FFD6DD
Aa3.87:1 Poor#FFD6DD on #B14C69

Color blindness preview

CSS variables

/* Peppy Peacock to Botanical Night — https://swatchly.xyz/palette/3acbc0-b14c69-ffd6dd-00443f */
:root {
  --peppy-peacock: #3acbc0;
  --extravagant-blush: #b14c69;
  --we-peep: #ffd6dd;
  --botanical-night: #00443f;
}

Tailwind CSS v4

/* Peppy Peacock to Botanical Night — https://swatchly.xyz/palette/3acbc0-b14c69-ffd6dd-00443f */
@theme {
  --color-peppy-peacock: #3acbc0;
  --color-peppy-peacock-50: #b6fef6;
  --color-peppy-peacock-100: #a0f4eb;
  --color-peppy-peacock-200: #7ae0d6;
  --color-peppy-peacock-300: #3acbc0;
  --color-peppy-peacock-400: #00ada3;
  --color-peppy-peacock-500: #009188;
  --color-peppy-peacock-600: #00756e;
  --color-peppy-peacock-700: #005e58;
  --color-peppy-peacock-800: #004b46;
  --color-peppy-peacock-900: #003c38;
  --color-peppy-peacock-950: #002623;
  --color-extravagant-blush: #b14c69;
  --color-extravagant-blush-50: #fff1f4;
  --color-extravagant-blush-100: #ffe5ea;
  --color-extravagant-blush-200: #ffcad5;
  --color-extravagant-blush-300: #ffa8bc;
  --color-extravagant-blush-400: #e8839d;
  --color-extravagant-blush-500: #ce6682;
  --color-extravagant-blush-600: #b14c69;
  --color-extravagant-blush-700: #923652;
  --color-extravagant-blush-800: #77253f;
  --color-extravagant-blush-900: #5e182f;
  --color-extravagant-blush-950: #3e0b1c;
  --color-we-peep: #ffd6dd;
  --color-we-peep-50: #ffe6ea;
  --color-we-peep-100: #ffd6dd;
  --color-we-peep-200: #e6c7cc;
  --color-we-peep-300: #d4b1b7;
  --color-we-peep-400: #b79299;
  --color-we-peep-500: #9d787f;
  --color-we-peep-600: #826066;
  --color-we-peep-700: #6b4b51;
  --color-we-peep-800: #553a3f;
  --color-we-peep-900: #422b30;
  --color-we-peep-950: #2a1a1d;
  --color-botanical-night: #00443f;
  --color-botanical-night-50: #ddfdf9;
  --color-botanical-night-100: #d0f4ef;
  --color-botanical-night-200: #b7e2dc;
  --color-botanical-night-300: #9bccc6;
  --color-botanical-night-400: #78afa9;
  --color-botanical-night-500: #5c958f;
  --color-botanical-night-600: #437b75;
  --color-botanical-night-700: #30655f;
  --color-botanical-night-800: #21524d;
  --color-botanical-night-900: #00443f;
  --color-botanical-night-950: #0a2b28;
}