Pink Marshmallow to Close but No Cigar color palette

F8B4CCPink Marshmallow CD84B7Pink Punk 3A75B6Campanula 275F4FPhilodendron 32240FClose but No Cigar

About this palette

Pink Marshmallow to Close but No Cigar is a 5-color warm, vintage palette: #F8B4CC (Pink Marshmallow), #CD84B7 (Pink Punk), #3A75B6 (Campanula), #275F4F (Philodendron), #32240F (Close but No Cigar). It mixes pink, blue, turquoise, brown tones and feels warm overall. The strongest text pairing is #F8B4CC on #32240F with a contrast ratio of 8.88:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pink Marshmallow	rgb(248, 180, 204)	hsl(339, 83%, 84%)
Pink Punk	rgb(205, 132, 183)	hsl(318, 42%, 66%)
Campanula	rgb(58, 117, 182)	hsl(211, 52%, 47%)
Philodendron	rgb(39, 95, 79)	hsl(163, 42%, 26%)
Close but No Cigar	rgb(50, 36, 15)	hsl(36, 54%, 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.88:1 Very good#F8B4CC on #32240F
Aa8.88:1 Very good#32240F on #F8B4CC
Aa5.43:1 Good#CD84B7 on #32240F
Aa5.43:1 Good#32240F on #CD84B7
Aa4.37:1 Poor#F8B4CC on #275F4F
Aa4.37:1 Poor#275F4F on #F8B4CC
Aa3.15:1 Poor#3A75B6 on #32240F
Aa3.15:1 Poor#32240F on #3A75B6

Color blindness preview

CSS variables

/* Pink Marshmallow to Close but No Cigar — https://swatchly.xyz/palette/f8b4cc-cd84b7-3a75b6-275f4f-32240f */
:root {
  --pink-marshmallow: #f8b4cc;
  --pink-punk: #cd84b7;
  --campanula: #3a75b6;
  --philodendron: #275f4f;
  --close-but-no-cigar: #32240f;
}

Tailwind CSS v4

/* Pink Marshmallow to Close but No Cigar — https://swatchly.xyz/palette/f8b4cc-cd84b7-3a75b6-275f4f-32240f */
@theme {
  --color-pink-marshmallow: #f8b4cc;
  --color-pink-marshmallow-50: #fff8fa;
  --color-pink-marshmallow-100: #ffecf2;
  --color-pink-marshmallow-200: #ffd1e1;
  --color-pink-marshmallow-300: #f8b4cc;
  --color-pink-marshmallow-400: #d295ab;
  --color-pink-marshmallow-500: #b5778e;
  --color-pink-marshmallow-600: #975b71;
  --color-pink-marshmallow-700: #7b4459;
  --color-pink-marshmallow-800: #613245;
  --color-pink-marshmallow-900: #4b2434;
  --color-pink-marshmallow-950: #311520;
  --color-pink-punk: #cd84b7;
  --color-pink-punk-50: #ffeff9;
  --color-pink-punk-100: #ffe0f4;
  --color-pink-punk-200: #fcc2e9;
  --color-pink-punk-300: #e9a8d4;
  --color-pink-punk-400: #cd84b7;
  --color-pink-punk-500: #b0699b;
  --color-pink-punk-600: #935080;
  --color-pink-punk-700: #783c67;
  --color-pink-punk-800: #612c52;
  --color-pink-punk-900: #4c2040;
  --color-pink-punk-950: #321129;
  --color-campanula: #3a75b6;
  --color-campanula-50: #eef6ff;
  --color-campanula-100: #e0eeff;
  --color-campanula-200: #c0ddff;
  --color-campanula-300: #9ac9ff;
  --color-campanula-400: #71aaeb;
  --color-campanula-500: #548fd2;
  --color-campanula-600: #3a75b6;
  --color-campanula-700: #255c98;
  --color-campanula-800: #15487c;
  --color-campanula-900: #0a3663;
  --color-campanula-950: #032141;
  --color-philodendron: #275f4f;
  --color-philodendron-50: #defdf2;
  --color-philodendron-100: #d1f4e8;
  --color-philodendron-200: #b8e2d3;
  --color-philodendron-300: #9cccbc;
  --color-philodendron-400: #78ae9c;
  --color-philodendron-500: #5a9280;
  --color-philodendron-600: #407666;
  --color-philodendron-700: #275f4f;
  --color-philodendron-800: #1e4a3d;
  --color-philodendron-900: #13392f;
  --color-philodendron-950: #08241c;
  --color-close-but-no-cigar: #32240f;
  --color-close-but-no-cigar-50: #fef4e5;
  --color-close-but-no-cigar-100: #f5e9da;
  --color-close-but-no-cigar-200: #e3d5c3;
  --color-close-but-no-cigar-300: #cebea9;
  --color-close-but-no-cigar-400: #b09f88;
  --color-close-but-no-cigar-500: #96856d;
  --color-close-but-no-cigar-600: #7c6c55;
  --color-close-but-no-cigar-700: #665742;
  --color-close-but-no-cigar-800: #534633;
  --color-close-but-no-cigar-900: #433727;
  --color-close-but-no-cigar-950: #32240f;
}