Start generating

Chewing Gum to White Strawberry color palette

E6B2A8Chewing GumC9D6BABitter MelonFCC5CECotton Candy CometE6E2FFHolographic LavenderFFE0B3White Strawberry
Open in generator Export PNG, PDF, ASE…

About this palette

Chewing Gum to White Strawberry is a 5-color pastel, light, warm palette: #E6B2A8 (Chewing Gum), #C9D6BA (Bitter Melon), #FCC5CE (Cotton Candy Comet), #E6E2FF (Holographic Lavender), #FFE0B3 (White Strawberry). It mixes pink, green, purple, yellow tones and feels warm overall. The strongest text pairing is #E6B2A8 on #E6E2FF with a contrast ratio of 1.48:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Chewing Gumrgb(230, 178, 168)hsl(10, 55%, 78%)
Bitter Melonrgb(201, 214, 186)hsl(88, 25%, 78%)
Cotton Candy Cometrgb(252, 197, 206)hsl(350, 90%, 88%)
Holographic Lavenderrgb(230, 226, 255)hsl(248, 100%, 94%)
White Strawberryrgb(255, 224, 179)hsl(36, 100%, 85%)

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.

    Color blindness preview

    • Protanopia
    • Deuteranopia
    • Tritanopia
    • Achromatopsia
    • Dog vision

    CSS variables

    /* Chewing Gum to White Strawberry — https://swatchly.xyz/palette/e6b2a8-c9d6ba-fcc5ce-e6e2ff-ffe0b3 */
:root {
  --chewing-gum: #e6b2a8;
  --bitter-melon: #c9d6ba;
  --cotton-candy-comet: #fcc5ce;
  --holographic-lavender: #e6e2ff;
  --white-strawberry: #ffe0b3;
}

    Tailwind CSS v4

    /* Chewing Gum to White Strawberry — https://swatchly.xyz/palette/e6b2a8-c9d6ba-fcc5ce-e6e2ff-ffe0b3 */
@theme {
  --color-chewing-gum: #e6b2a8;
  --color-chewing-gum-50: #fff1ef;
  --color-chewing-gum-100: #ffe4de;
  --color-chewing-gum-200: #f4ccc5;
  --color-chewing-gum-300: #e6b2a8;
  --color-chewing-gum-400: #c4948a;
  --color-chewing-gum-500: #a8786f;
  --color-chewing-gum-600: #8c5e56;
  --color-chewing-gum-700: #724941;
  --color-chewing-gum-800: #5b3731;
  --color-chewing-gum-900: #482a24;
  --color-chewing-gum-950: #2e1915;
  --color-bitter-melon: #c9d6ba;
  --color-bitter-melon-50: #ecf4e3;
  --color-bitter-melon-100: #e0e9d6;
  --color-bitter-melon-200: #c9d6ba;
  --color-bitter-melon-300: #b5c0a8;
  --color-bitter-melon-400: #96a288;
  --color-bitter-melon-500: #7c886e;
  --color-bitter-melon-600: #636e56;
  --color-bitter-melon-700: #4e5842;
  --color-bitter-melon-800: #3d4632;
  --color-bitter-melon-900: #2e3625;
  --color-bitter-melon-950: #1c2116;
  --color-cotton-candy-comet: #fcc5ce;
  --color-cotton-candy-comet-50: #ffeff2;
  --color-cotton-candy-comet-100: #ffe1e5;
  --color-cotton-candy-comet-200: #fcc5ce;
  --color-cotton-candy-comet-300: #e0b1b9;
  --color-cotton-candy-comet-400: #c39199;
  --color-cotton-candy-comet-500: #a7767e;
  --color-cotton-candy-comet-600: #8b5c65;
  --color-cotton-candy-comet-700: #71474f;
  --color-cotton-candy-comet-800: #5b363d;
  --color-cotton-candy-comet-900: #47282e;
  --color-cotton-candy-comet-950: #2e181c;
  --color-holographic-lavender: #e6e2ff;
  --color-holographic-lavender-50: #f1efff;
  --color-holographic-lavender-100: #e6e2ff;
  --color-holographic-lavender-200: #d3d0e6;
  --color-holographic-lavender-300: #bebad2;
  --color-holographic-lavender-400: #9f9bb5;
  --color-holographic-lavender-500: #85819b;
  --color-holographic-lavender-600: #6b6780;
  --color-holographic-lavender-700: #555268;
  --color-holographic-lavender-800: #423f53;
  --color-holographic-lavender-900: #333041;
  --color-holographic-lavender-950: #1f1d29;
  --color-white-strawberry: #ffe0b3;
  --color-white-strawberry-50: #ffedd4;
  --color-white-strawberry-100: #ffe0b3;
  --color-white-strawberry-200: #e6cfad;
  --color-white-strawberry-300: #d3b993;
  --color-white-strawberry-400: #b69a71;
  --color-white-strawberry-500: #9b7f55;
  --color-white-strawberry-600: #81663d;
  --color-white-strawberry-700: #69512b;
  --color-white-strawberry-800: #533e1d;
  --color-white-strawberry-900: #412f13;
  --color-white-strawberry-950: #2a1d08;
}

    Similar palettes