Start generating

Perfect Pink to Ivory Tower color palette

E8B2AFPerfect PinkA9D1F2Andromeda BlueFFC19ABlushing CinnamonE0D2F4Bubblegum CrisisF4E1C0Cloud of CreamFFF1EDIvory Tower
Open in generator Export PNG, PDF, ASE…

About this palette

Perfect Pink to Ivory Tower is a 6-color pastel, light palette: #E8B2AF (Perfect Pink), #A9D1F2 (Andromeda Blue), #FFC19A (Blushing Cinnamon), #E0D2F4 (Bubblegum Crisis), #F4E1C0 (Cloud of Cream), #FFF1ED (Ivory Tower). It mixes pink, blue, orange, purple, yellow, white tones and feels warm overall. The strongest text pairing is #E8B2AF on #FFF1ED with a contrast ratio of 1.67:1, and 0 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Perfect Pinkrgb(232, 178, 175)hsl(3, 55%, 80%)
Andromeda Bluergb(169, 209, 242)hsl(207, 74%, 81%)
Blushing Cinnamonrgb(255, 193, 154)hsl(23, 100%, 80%)
Bubblegum Crisisrgb(224, 210, 244)hsl(265, 61%, 89%)
Cloud of Creamrgb(244, 225, 192)hsl(38, 70%, 85%)
Ivory Towerrgb(255, 241, 237)hsl(13, 100%, 96%)

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

    /* Perfect Pink to Ivory Tower — https://swatchly.xyz/palette/e8b2af-a9d1f2-ffc19a-e0d2f4-f4e1c0-fff1ed */
:root {
  --perfect-pink: #e8b2af;
  --andromeda-blue: #a9d1f2;
  --blushing-cinnamon: #ffc19a;
  --bubblegum-crisis: #e0d2f4;
  --cloud-of-cream: #f4e1c0;
  --ivory-tower: #fff1ed;
}

    Tailwind CSS v4

    /* Perfect Pink to Ivory Tower — https://swatchly.xyz/palette/e8b2af-a9d1f2-ffc19a-e0d2f4-f4e1c0-fff1ed */
@theme {
  --color-perfect-pink: #e8b2af;
  --color-perfect-pink-50: #fff2f1;
  --color-perfect-pink-100: #ffe4e3;
  --color-perfect-pink-200: #f6cdca;
  --color-perfect-pink-300: #e8b2af;
  --color-perfect-pink-400: #c59391;
  --color-perfect-pink-500: #aa7875;
  --color-perfect-pink-600: #8d5e5c;
  --color-perfect-pink-700: #734846;
  --color-perfect-pink-800: #5c3735;
  --color-perfect-pink-900: #482928;
  --color-perfect-pink-950: #2e1817;
  --color-andromeda-blue: #a9d1f2;
  --color-andromeda-blue-50: #f7fbff;
  --color-andromeda-blue-100: #e8f4ff;
  --color-andromeda-blue-200: #c9e5fc;
  --color-andromeda-blue-300: #a9d1f2;
  --color-andromeda-blue-400: #8bafcd;
  --color-andromeda-blue-500: #6c92b0;
  --color-andromeda-blue-600: #507592;
  --color-andromeda-blue-700: #3a5c77;
  --color-andromeda-blue-800: #2a475e;
  --color-andromeda-blue-900: #1d3549;
  --color-andromeda-blue-950: #0f212f;
  --color-blushing-cinnamon: #ffc19a;
  --color-blushing-cinnamon-50: #ffece1;
  --color-blushing-cinnamon-100: #ffdec9;
  --color-blushing-cinnamon-200: #ffc19a;
  --color-blushing-cinnamon-300: #e3ae8c;
  --color-blushing-cinnamon-400: #c78e6a;
  --color-blushing-cinnamon-500: #ac744f;
  --color-blushing-cinnamon-600: #905b37;
  --color-blushing-cinnamon-700: #774726;
  --color-blushing-cinnamon-800: #613618;
  --color-blushing-cinnamon-900: #4c280f;
  --color-blushing-cinnamon-950: #311806;
  --color-bubblegum-crisis: #e0d2f4;
  --color-bubblegum-crisis-50: #f8f4ff;
  --color-bubblegum-crisis-100: #f1e8fd;
  --color-bubblegum-crisis-200: #e0d2f4;
  --color-bubblegum-crisis-300: #c8bcd9;
  --color-bubblegum-crisis-400: #a99cbb;
  --color-bubblegum-crisis-500: #8d809f;
  --color-bubblegum-crisis-600: #726683;
  --color-bubblegum-crisis-700: #5b506a;
  --color-bubblegum-crisis-800: #473d54;
  --color-bubblegum-crisis-900: #372e42;
  --color-bubblegum-crisis-950: #221c2a;
  --color-cloud-of-cream: #f4e1c0;
  --color-cloud-of-cream-50: #f9edda;
  --color-cloud-of-cream-100: #f4e1c0;
  --color-cloud-of-cream-200: #decfb6;
  --color-cloud-of-cream-300: #caba9e;
  --color-cloud-of-cream-400: #ad9c7d;
  --color-cloud-of-cream-500: #938163;
  --color-cloud-of-cream-600: #79684b;
  --color-cloud-of-cream-700: #625338;
  --color-cloud-of-cream-800: #4d4029;
  --color-cloud-of-cream-900: #3c311d;
  --color-cloud-of-cream-950: #261e10;
  --color-ivory-tower: #fff1ed;
  --color-ivory-tower-50: #fff1ed;
  --color-ivory-tower-100: #f1e8e6;
  --color-ivory-tower-200: #dfd4d2;
  --color-ivory-tower-300: #c9beba;
  --color-ivory-tower-400: #ab9e9b;
  --color-ivory-tower-500: #8f837f;
  --color-ivory-tower-600: #756965;
  --color-ivory-tower-700: #5d5350;
  --color-ivory-tower-800: #49403d;
  --color-ivory-tower-900: #39312f;
  --color-ivory-tower-950: #231e1c;
}

    Similar palettes