Fruit of Passion to Hatoba Pigeon color palette

8F697BFruit of Passion FFF5FEWalkie Chalkie D7C6E5Foggy Love 533B39Monkey Island A08596Hatoba Pigeon

Open in generator Export PNG, PDF, ASE…

About this palette

Fruit of Passion to Hatoba Pigeon is a 5-color muted palette: #8F697B (Fruit of Passion), #FFF5FE (Walkie Chalkie), #D7C6E5 (Foggy Love), #533B39 (Monkey Island), #A08596 (Hatoba Pigeon). It mixes red, white, purple, gray, pink tones and feels warm overall. The strongest text pairing is #FFF5FE on #533B39 with a contrast ratio of 9.62:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Fruit of Passion	rgb(143, 105, 123)	hsl(332, 15%, 49%)
Walkie Chalkie	rgb(255, 245, 254)	hsl(306, 100%, 98%)
Foggy Love	rgb(215, 198, 229)	hsl(273, 37%, 84%)
Monkey Island	rgb(83, 59, 57)	hsl(5, 19%, 27%)
Hatoba Pigeon	rgb(160, 133, 150)	hsl(322, 12%, 57%)

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.62:1 Very good#FFF5FE on #533B39
Aa9.62:1 Very good#533B39 on #FFF5FE
Aa6.38:1 Good#D7C6E5 on #533B39
Aa6.38:1 Good#533B39 on #D7C6E5
Aa4.41:1 Poor#8F697B on #FFF5FE
Aa4.41:1 Poor#FFF5FE on #8F697B
Aa3.14:1 Poor#FFF5FE on #A08596
Aa3.14:1 Poor#A08596 on #FFF5FE

Color blindness preview

CSS variables

/* Fruit of Passion to Hatoba Pigeon — https://swatchly.xyz/palette/8f697b-fff5fe-d7c6e5-533b39-a08596 */
:root {
  --fruit-of-passion: #8f697b;
  --walkie-chalkie: #fff5fe;
  --foggy-love: #d7c6e5;
  --monkey-island: #533b39;
  --hatoba-pigeon: #a08596;
}

Tailwind CSS v4

/* Fruit of Passion to Hatoba Pigeon — https://swatchly.xyz/palette/8f697b-fff5fe-d7c6e5-533b39-a08596 */
@theme {
  --color-fruit-of-passion: #8f697b;
  --color-fruit-of-passion-50: #fff1f7;
  --color-fruit-of-passion-100: #ffe5f0;
  --color-fruit-of-passion-200: #f0d1df;
  --color-fruit-of-passion-300: #debbcb;
  --color-fruit-of-passion-400: #c39cae;
  --color-fruit-of-passion-500: #a98294;
  --color-fruit-of-passion-600: #8f697b;
  --color-fruit-of-passion-700: #745162;
  --color-fruit-of-passion-800: #5c3e4d;
  --color-fruit-of-passion-900: #482e3b;
  --color-fruit-of-passion-950: #2e1b24;
  --color-walkie-chalkie: #fff5fe;
  --color-walkie-chalkie-50: #fff5fe;
  --color-walkie-chalkie-100: #f2ecf1;
  --color-walkie-chalkie-200: #ded7dd;
  --color-walkie-chalkie-300: #c8c0c7;
  --color-walkie-chalkie-400: #a89fa7;
  --color-walkie-chalkie-500: #8c838b;
  --color-walkie-chalkie-600: #716970;
  --color-walkie-chalkie-700: #5a5259;
  --color-walkie-chalkie-800: #474046;
  --color-walkie-chalkie-900: #363136;
  --color-walkie-chalkie-950: #221e21;
  --color-foggy-love: #d7c6e5;
  --color-foggy-love-50: #f4eafd;
  --color-foggy-love-100: #e9def3;
  --color-foggy-love-200: #d7c6e5;
  --color-foggy-love-300: #c1b2cd;
  --color-foggy-love-400: #a494b1;
  --color-foggy-love-500: #8a7a97;
  --color-foggy-love-600: #71627d;
  --color-foggy-love-700: #5b4e66;
  --color-foggy-love-800: #493d52;
  --color-foggy-love-900: #382e40;
  --color-foggy-love-950: #231c29;
  --color-monkey-island: #533b39;
  --color-monkey-island-50: #fff2f0;
  --color-monkey-island-100: #f9e6e4;
  --color-monkey-island-200: #e8d1cf;
  --color-monkey-island-300: #d3bab8;
  --color-monkey-island-400: #b59a97;
  --color-monkey-island-500: #9a7e7c;
  --color-monkey-island-600: #7e6462;
  --color-monkey-island-700: #664e4c;
  --color-monkey-island-800: #533b39;
  --color-monkey-island-900: #3f2e2c;
  --color-monkey-island-950: #281b1a;
  --color-hatoba-pigeon: #a08596;
  --color-hatoba-pigeon-50: #fff2fa;
  --color-hatoba-pigeon-100: #fae8f3;
  --color-hatoba-pigeon-200: #ead5e2;
  --color-hatoba-pigeon-300: #d7bfcd;
  --color-hatoba-pigeon-400: #baa0b0;
  --color-hatoba-pigeon-500: #a08596;
  --color-hatoba-pigeon-600: #83697a;
  --color-hatoba-pigeon-700: #695261;
  --color-hatoba-pigeon-800: #533f4c;
  --color-hatoba-pigeon-900: #402f3a;
  --color-hatoba-pigeon-950: #281c24;
}