Strawberry Buttercream to Lily Pads color palette

FFB1F7Strawberry Buttercream 055B34Ficus Elastica 260B21Shot in the Dark A947A1Fuchsia Pheromone 5FB485Lily Pads

Open in generator Export PNG, PDF, ASE…

About this palette

Strawberry Buttercream to Lily Pads is a 5-color warm palette: #FFB1F7 (Strawberry Buttercream), #055B34 (Ficus Elastica), #260B21 (Shot in the Dark), #A947A1 (Fuchsia Pheromone), #5FB485 (Lily Pads). It mixes pink, green, purple tones and feels warm overall. The strongest text pairing is #FFB1F7 on #260B21 with a contrast ratio of 11.18:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Strawberry Buttercream	rgb(255, 177, 247)	hsl(306, 100%, 85%)
Ficus Elastica	rgb(5, 91, 52)	hsl(153, 90%, 19%)
Shot in the Dark	rgb(38, 11, 33)	hsl(311, 55%, 10%)
Fuchsia Pheromone	rgb(169, 71, 161)	hsl(305, 41%, 47%)
Lily Pads	rgb(95, 180, 133)	hsl(147, 36%, 54%)

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.

Aa11.18:1 Very good#FFB1F7 on #260B21
Aa11.18:1 Very good#260B21 on #FFB1F7
Aa7.25:1 Very good#260B21 on #5FB485
Aa7.25:1 Very good#5FB485 on #260B21
Aa5.05:1 Good#FFB1F7 on #055B34
Aa5.05:1 Good#055B34 on #FFB1F7
Aa3.56:1 Poor#260B21 on #A947A1
Aa3.56:1 Poor#A947A1 on #260B21

Color blindness preview

CSS variables

/* Strawberry Buttercream to Lily Pads — https://swatchly.xyz/palette/ffb1f7-055b34-260b21-a947a1-5fb485 */
:root {
  --strawberry-buttercream: #ffb1f7;
  --ficus-elastica: #055b34;
  --shot-in-the-dark: #260b21;
  --fuchsia-pheromone: #a947a1;
  --lily-pads: #5fb485;
}

Tailwind CSS v4

/* Strawberry Buttercream to Lily Pads — https://swatchly.xyz/palette/ffb1f7-055b34-260b21-a947a1-5fb485 */
@theme {
  --color-strawberry-buttercream: #ffb1f7;
  --color-strawberry-buttercream-50: #ffe7fc;
  --color-strawberry-buttercream-100: #ffd5fa;
  --color-strawberry-buttercream-200: #ffb1f7;
  --color-strawberry-buttercream-300: #e4a0dc;
  --color-strawberry-buttercream-400: #c77fc1;
  --color-strawberry-buttercream-500: #ad64a6;
  --color-strawberry-buttercream-600: #904c8b;
  --color-strawberry-buttercream-700: #773972;
  --color-strawberry-buttercream-800: #612a5d;
  --color-strawberry-buttercream-900: #4c1d49;
  --color-strawberry-buttercream-950: #31102f;
  --color-ficus-elastica: #055b34;
  --color-ficus-elastica-50: #deffe8;
  --color-ficus-elastica-100: #cbf8da;
  --color-ficus-elastica-200: #afe5c1;
  --color-ficus-elastica-300: #8fcea6;
  --color-ficus-elastica-400: #68ae83;
  --color-ficus-elastica-500: #489166;
  --color-ficus-elastica-600: #2d734c;
  --color-ficus-elastica-700: #055b34;
  --color-ficus-elastica-800: #0b4629;
  --color-ficus-elastica-900: #04371e;
  --color-ficus-elastica-950: #012210;
  --color-shot-in-the-dark: #260b21;
  --color-shot-in-the-dark-50: #fff0fb;
  --color-shot-in-the-dark-100: #fbe3f5;
  --color-shot-in-the-dark-200: #eacee3;
  --color-shot-in-the-dark-300: #d6b6cd;
  --color-shot-in-the-dark-400: #b895af;
  --color-shot-in-the-dark-500: #9b7892;
  --color-shot-in-the-dark-600: #7d5c75;
  --color-shot-in-the-dark-700: #62465c;
  --color-shot-in-the-dark-800: #4b3346;
  --color-shot-in-the-dark-900: #382433;
  --color-shot-in-the-dark-950: #260b21;
  --color-fuchsia-pheromone: #a947a1;
  --color-fuchsia-pheromone-50: #fff0fd;
  --color-fuchsia-pheromone-100: #ffe3fb;
  --color-fuchsia-pheromone-200: #ffc5f7;
  --color-fuchsia-pheromone-300: #f9a3f0;
  --color-fuchsia-pheromone-400: #df7fd5;
  --color-fuchsia-pheromone-500: #c562bc;
  --color-fuchsia-pheromone-600: #a947a1;
  --color-fuchsia-pheromone-700: #8b3085;
  --color-fuchsia-pheromone-800: #701f6b;
  --color-fuchsia-pheromone-900: #591254;
  --color-fuchsia-pheromone-950: #3a0737;
  --color-lily-pads: #5fb485;
  --color-lily-pads-50: #daffe8;
  --color-lily-pads-100: #c5f9d9;
  --color-lily-pads-200: #a9e7c2;
  --color-lily-pads-300: #8ad2a8;
  --color-lily-pads-400: #5fb485;
  --color-lily-pads-500: #42986b;
  --color-lily-pads-600: #257d52;
  --color-lily-pads-700: #0c653e;
  --color-lily-pads-800: #004f2f;
  --color-lily-pads-900: #003e23;
  --color-lily-pads-950: #002714;
}