Puff of Pink to Aubergine color palette
FFC8E8Puff of PinkCC8994Pinch MeAA6E5AAmaretto8A5648Annatto5E3955Long Passionate Night352022Aubergine
About this palette
Puff of Pink to Aubergine is a 6-color warm, vintage palette: #FFC8E8 (Puff of Pink), #CC8994 (Pinch Me), #AA6E5A (Amaretto), #8A5648 (Annatto), #5E3955 (Long Passionate Night), #352022 (Aubergine). It mixes pink, red, purple, gray tones and feels warm overall. The strongest text pairing is #FFC8E8 on #352022 with a contrast ratio of 10.63:1, and 3 of its 15 color pairs pass WCAG AA for normal text.
Color codes
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Puff of Pink | rgb(255, 200, 232) | hsl(325, 100%, 89%) | |
| Pinch Me | rgb(204, 137, 148) | hsl(350, 40%, 67%) | |
| Amaretto | rgb(170, 110, 90) | hsl(15, 32%, 51%) | |
| Annatto | rgb(138, 86, 72) | hsl(13, 31%, 41%) | |
| Long Passionate Night | rgb(94, 57, 85) | hsl(315, 25%, 30%) | |
| Aubergine | rgb(53, 32, 34) | hsl(354, 25%, 17%) |
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.
- Aa10.63:1 #FFC8E8 on #352022
- Aa10.63:1 #352022 on #FFC8E8
- Aa6.70:1 #FFC8E8 on #5E3955
- Aa6.70:1 #5E3955 on #FFC8E8
- Aa5.48:1 #CC8994 on #352022
- Aa5.48:1 #352022 on #CC8994
- Aa4.19:1 #FFC8E8 on #8A5648
- Aa4.19:1 #8A5648 on #FFC8E8
Color blindness preview
- Protanopia
- Deuteranopia
- Tritanopia
- Achromatopsia
- Dog vision
CSS variables
/* Puff of Pink to Aubergine — https://swatchly.xyz/palette/ffc8e8-cc8994-aa6e5a-8a5648-5e3955-352022 */
:root {
--puff-of-pink: #ffc8e8;
--pinch-me: #cc8994;
--amaretto: #aa6e5a;
--annatto: #8a5648;
--long-passionate-night: #5e3955;
--aubergine: #352022;
}
Tailwind CSS v4
/* Puff of Pink to Aubergine — https://swatchly.xyz/palette/ffc8e8-cc8994-aa6e5a-8a5648-5e3955-352022 */
@theme {
--color-puff-of-pink: #ffc8e8;
--color-puff-of-pink-50: #fff4fa;
--color-puff-of-pink-100: #ffe6f4;
--color-puff-of-pink-200: #ffc8e8;
--color-puff-of-pink-300: #e2b4ce;
--color-puff-of-pink-400: #c492af;
--color-puff-of-pink-500: #a87694;
--color-puff-of-pink-600: #8b5c78;
--color-puff-of-pink-700: #704660;
--color-puff-of-pink-800: #59344b;
--color-puff-of-pink-900: #46273a;
--color-puff-of-pink-950: #2d1725;
--color-pinch-me: #cc8994;
--color-pinch-me-50: #fff0f2;
--color-pinch-me-100: #ffe1e5;
--color-pinch-me-200: #fbc5cd;
--color-pinch-me-300: #e8acb5;
--color-pinch-me-400: #cc8994;
--color-pinch-me-500: #af6f7a;
--color-pinch-me-600: #925560;
--color-pinch-me-700: #78414b;
--color-pinch-me-800: #60313a;
--color-pinch-me-900: #4c242c;
--color-pinch-me-950: #32151b;
--color-amaretto: #aa6e5a;
--color-amaretto-50: #fff0eb;
--color-amaretto-100: #ffe1d7;
--color-amaretto-200: #f9c6b6;
--color-amaretto-300: #e6ad9a;
--color-amaretto-400: #c78b76;
--color-amaretto-500: #aa6e5a;
--color-amaretto-600: #8e5643;
--color-amaretto-700: #744231;
--color-amaretto-800: #5d3223;
--color-amaretto-900: #4a2519;
--color-amaretto-950: #31160d;
--color-annatto: #8a5648;
--color-annatto-50: #fff2ee;
--color-annatto-100: #ffe3db;
--color-annatto-200: #f7c9bd;
--color-annatto-300: #e3b0a2;
--color-annatto-400: #c58e7f;
--color-annatto-500: #a77162;
--color-annatto-600: #8a5648;
--color-annatto-700: #704336;
--color-annatto-800: #5a3228;
--color-annatto-900: #47261d;
--color-annatto-950: #2e1610;
--color-long-passionate-night: #5e3955;
--color-long-passionate-night-50: #fff0fb;
--color-long-passionate-night-100: #fee1f6;
--color-long-passionate-night-200: #eecce4;
--color-long-passionate-night-300: #dab5d0;
--color-long-passionate-night-400: #be95b3;
--color-long-passionate-night-500: #a37a98;
--color-long-passionate-night-600: #88617e;
--color-long-passionate-night-700: #704c67;
--color-long-passionate-night-800: #5e3955;
--color-long-passionate-night-900: #482c41;
--color-long-passionate-night-950: #2e1b2a;
--color-aubergine: #352022;
--color-aubergine-50: #fff1f2;
--color-aubergine-100: #f8e6e7;
--color-aubergine-200: #e7d1d3;
--color-aubergine-300: #d2babc;
--color-aubergine-400: #b49a9c;
--color-aubergine-500: #9b8082;
--color-aubergine-600: #816769;
--color-aubergine-700: #6a5355;
--color-aubergine-800: #564243;
--color-aubergine-900: #463436;
--color-aubergine-950: #352022;
}
Similar palettes
- EFC3C4D09397AE7574905B5F783E40351E20Berry Good to Bruised Plum
- 311A1DFFC3C0763B3DCF8E95A16663Black Cherry to Cinnapink
- D19CB2642C339E6853FACEDE2E1312Exotic Lilac to Black Cherry
- 583141421A28BC8290E6A1BFA0596EF1C9D9Shadow Purple to Smidgen of Love
- 281627623444734E5DB86B5AB98FBCFFC2BABlack Cherry to Peach Fuzz
- EEC5BE7C4B47BB908A3B2A28A17670Strawberry Risotto to Equestrienne
- FFD1DDE896ABAD6C776C31462C1C1FLight Pink to Velvet Black
- CDB3C19E89A57E5D58584157F5DBDA2B2124Mauvelous to Ink Black