Pretty in Pink to Soul Anchor color palette

FFC2F2Pretty in Pink 4AC693Macau 009C79Paolo Veronese Green B44182Razzle Dazzle 005C45Evergreen 551440Soul Anchor

Open in generator Export PNG, PDF, ASE…

About this palette

Pretty in Pink to Soul Anchor is a 6-color palette: #FFC2F2 (Pretty in Pink), #4AC693 (Macau), #009C79 (Paolo Veronese Green), #B44182 (Razzle Dazzle), #005C45 (Evergreen), #551440 (Soul Anchor). It mixes pink, green, turquoise, red tones and feels balanced overall. The strongest text pairing is #FFC2F2 on #551440 with a contrast ratio of 9.13:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pretty in Pink	rgb(255, 194, 242)	hsl(313, 100%, 88%)
Macau	rgb(74, 198, 147)	hsl(155, 52%, 53%)
Paolo Veronese Green	rgb(0, 156, 121)	hsl(167, 100%, 31%)
Razzle Dazzle	rgb(180, 65, 130)	hsl(326, 47%, 48%)
Evergreen	rgb(0, 92, 69)	hsl(165, 100%, 18%)
Soul Anchor	rgb(85, 20, 64)	hsl(319, 62%, 21%)

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.13:1 Very good#FFC2F2 on #551440
Aa9.13:1 Very good#551440 on #FFC2F2
Aa6.27:1 Good#4AC693 on #551440
Aa6.27:1 Good#551440 on #4AC693
Aa5.45:1 Good#FFC2F2 on #005C45
Aa5.45:1 Good#005C45 on #FFC2F2
Aa3.87:1 Poor#009C79 on #551440
Aa3.87:1 Poor#551440 on #009C79

Color blindness preview

CSS variables

/* Pretty in Pink to Soul Anchor — https://swatchly.xyz/palette/ffc2f2-4ac693-009c79-b44182-005c45-551440 */
:root {
  --pretty-in-pink: #ffc2f2;
  --macau: #4ac693;
  --paolo-veronese-green: #009c79;
  --razzle-dazzle: #b44182;
  --evergreen: #005c45;
  --soul-anchor: #551440;
}

Tailwind CSS v4

/* Pretty in Pink to Soul Anchor — https://swatchly.xyz/palette/ffc2f2-4ac693-009c79-b44182-005c45-551440 */
@theme {
  --color-pretty-in-pink: #ffc2f2;
  --color-pretty-in-pink-50: #fff1fc;
  --color-pretty-in-pink-100: #ffe2f8;
  --color-pretty-in-pink-200: #ffc2f2;
  --color-pretty-in-pink-300: #e2afd7;
  --color-pretty-in-pink-400: #c58db9;
  --color-pretty-in-pink-500: #a9719e;
  --color-pretty-in-pink-600: #8c5782;
  --color-pretty-in-pink-700: #724269;
  --color-pretty-in-pink-800: #5b3153;
  --color-pretty-in-pink-900: #472441;
  --color-pretty-in-pink-950: #2e152a;
  --color-macau: #4ac693;
  --color-macau-50: #eafff4;
  --color-macau-100: #cbffe4;
  --color-macau-200: #a5f3cd;
  --color-macau-300: #84e0b5;
  --color-macau-400: #4ac693;
  --color-macau-500: #21a776;
  --color-macau-600: #00875d;
  --color-macau-700: #006b49;
  --color-macau-800: #005338;
  --color-macau-900: #003f29;
  --color-macau-950: #002718;
  --color-paolo-veronese-green: #009c79;
  --color-paolo-veronese-green-50: #d9fff0;
  --color-paolo-veronese-green-100: #b8fce3;
  --color-paolo-veronese-green-200: #98ebcd;
  --color-paolo-veronese-green-300: #74d6b5;
  --color-paolo-veronese-green-400: #42b895;
  --color-paolo-veronese-green-500: #009c79;
  --color-paolo-veronese-green-600: #007e61;
  --color-paolo-veronese-green-700: #00644c;
  --color-paolo-veronese-green-800: #004e3b;
  --color-paolo-veronese-green-900: #003d2d;
  --color-paolo-veronese-green-950: #00261b;
  --color-razzle-dazzle: #b44182;
  --color-razzle-dazzle-50: #fff1f7;
  --color-razzle-dazzle-100: #ffe4f0;
  --color-razzle-dazzle-200: #ffc8e2;
  --color-razzle-dazzle-300: #ffa4d1;
  --color-razzle-dazzle-400: #ec7ab6;
  --color-razzle-dazzle-500: #d15c9c;
  --color-razzle-dazzle-600: #b44182;
  --color-razzle-dazzle-700: #952b69;
  --color-razzle-dazzle-800: #791953;
  --color-razzle-dazzle-900: #600d40;
  --color-razzle-dazzle-950: #3f0428;
  --color-evergreen: #005c45;
  --color-evergreen-50: #dbfff0;
  --color-evergreen-100: #caf7e5;
  --color-evergreen-200: #ade4ce;
  --color-evergreen-300: #8eceb5;
  --color-evergreen-400: #67ae94;
  --color-evergreen-500: #479177;
  --color-evergreen-600: #2b745c;
  --color-evergreen-700: #005c45;
  --color-evergreen-800: #074736;
  --color-evergreen-900: #013729;
  --color-evergreen-950: #002318;
  --color-soul-anchor: #551440;
  --color-soul-anchor-50: #fff0f8;
  --color-soul-anchor-100: #ffe1f2;
  --color-soul-anchor-200: #fec3e5;
  --color-soul-anchor-300: #eca9d0;
  --color-soul-anchor-400: #cf87b2;
  --color-soul-anchor-500: #b36a96;
  --color-soul-anchor-600: #95517b;
  --color-soul-anchor-700: #7a3c63;
  --color-soul-anchor-800: #622c4e;
  --color-soul-anchor-900: #551440;
  --color-soul-anchor-950: #321126;
}