Mystic Nights to Pretty in Pink color palette
4F297BMystic Nights823B44Wild Berry865DC7Lusty LavenderCE6BBESuper PinkF69FB9Prism PinkFFC1E8Pretty in Pink
About this palette
Mystic Nights to Pretty in Pink is a 6-color warm, gradient palette: #4F297B (Mystic Nights), #823B44 (Wild Berry), #865DC7 (Lusty Lavender), #CE6BBE (Super Pink), #F69FB9 (Prism Pink), #FFC1E8 (Pretty in Pink). It mixes purple, red, pink tones and feels warm overall. The strongest text pairing is #4F297B on #FFC1E8 with a contrast ratio of 7.26:1, and 3 of its 15 color pairs pass WCAG AA for normal text.
Color codes
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Mystic Nights | rgb(79, 41, 123) | hsl(268, 50%, 32%) | |
| Wild Berry | rgb(130, 59, 68) | hsl(352, 38%, 37%) | |
| Lusty Lavender | rgb(134, 93, 199) | hsl(263, 49%, 57%) | |
| Super Pink | rgb(206, 107, 190) | hsl(310, 50%, 61%) | |
| Prism Pink | rgb(246, 159, 185) | hsl(342, 83%, 79%) | |
| Pretty in Pink | rgb(255, 193, 232) | hsl(322, 100%, 88%) |
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.
- Aa7.26:1 #4F297B on #FFC1E8
- Aa7.26:1 #FFC1E8 on #4F297B
- Aa5.47:1 #4F297B on #F69FB9
- Aa5.47:1 #F69FB9 on #4F297B
- Aa5.28:1 #823B44 on #FFC1E8
- Aa5.28:1 #FFC1E8 on #823B44
- Aa3.98:1 #823B44 on #F69FB9
- Aa3.98:1 #F69FB9 on #823B44
Color blindness preview
- Protanopia
- Deuteranopia
- Tritanopia
- Achromatopsia
- Dog vision
CSS variables
/* Mystic Nights to Pretty in Pink — https://swatchly.xyz/palette/4f297b-823b44-865dc7-ce6bbe-f69fb9-ffc1e8 */
:root {
--mystic-nights: #4f297b;
--wild-berry: #823b44;
--lusty-lavender: #865dc7;
--super-pink: #ce6bbe;
--prism-pink: #f69fb9;
--pretty-in-pink: #ffc1e8;
}
Tailwind CSS v4
/* Mystic Nights to Pretty in Pink — https://swatchly.xyz/palette/4f297b-823b44-865dc7-ce6bbe-f69fb9-ffc1e8 */
@theme {
--color-mystic-nights: #4f297b;
--color-mystic-nights-50: #f7f3ff;
--color-mystic-nights-100: #efe6ff;
--color-mystic-nights-200: #dfcdff;
--color-mystic-nights-300: #ceafff;
--color-mystic-nights-400: #b08de4;
--color-mystic-nights-500: #9470c8;
--color-mystic-nights-600: #7956aa;
--color-mystic-nights-700: #61408c;
--color-mystic-nights-800: #4f297b;
--color-mystic-nights-900: #3b225b;
--color-mystic-nights-950: #25133c;
--color-wild-berry: #823b44;
--color-wild-berry-50: #fff1f2;
--color-wild-berry-100: #ffe3e5;
--color-wild-berry-200: #ffc7ca;
--color-wild-berry-300: #f2abb0;
--color-wild-berry-400: #d5898f;
--color-wild-berry-500: #b96c74;
--color-wild-berry-600: #9b525a;
--color-wild-berry-700: #823b44;
--color-wild-berry-800: #662d34;
--color-wild-berry-900: #512127;
--color-wild-berry-950: #351217;
--color-lusty-lavender: #865dc7;
--color-lusty-lavender-50: #f6f3ff;
--color-lusty-lavender-100: #f0e9ff;
--color-lusty-lavender-200: #e1d4ff;
--color-lusty-lavender-300: #d0b9ff;
--color-lusty-lavender-400: #b893fa;
--color-lusty-lavender-500: #9f77e2;
--color-lusty-lavender-600: #865dc7;
--color-lusty-lavender-700: #6c45a7;
--color-lusty-lavender-800: #563189;
--color-lusty-lavender-900: #42236e;
--color-lusty-lavender-950: #2a1349;
--color-super-pink: #ce6bbe;
--color-super-pink-50: #ffe9fa;
--color-super-pink-100: #ffd6f6;
--color-super-pink-200: #ffb1f0;
--color-super-pink-300: #ed92dd;
--color-super-pink-400: #ce6bbe;
--color-super-pink-500: #b251a3;
--color-super-pink-600: #963a89;
--color-super-pink-700: #7c2870;
--color-super-pink-800: #651a5b;
--color-super-pink-900: #511149;
--color-super-pink-950: #370731;
--color-prism-pink: #f69fb9;
--color-prism-pink-50: #ffeef2;
--color-prism-pink-100: #ffdee7;
--color-prism-pink-200: #ffbfd1;
--color-prism-pink-300: #f69fb9;
--color-prism-pink-400: #d3829b;
--color-prism-pink-500: #b76680;
--color-prism-pink-600: #9a4d67;
--color-prism-pink-700: #7f3a51;
--color-prism-pink-800: #672a3f;
--color-prism-pink-900: #521e31;
--color-prism-pink-950: #36101e;
--color-pretty-in-pink: #ffc1e8;
--color-pretty-in-pink-50: #fff0f9;
--color-pretty-in-pink-100: #ffe0f3;
--color-pretty-in-pink-200: #ffc1e8;
--color-pretty-in-pink-300: #e2aecf;
--color-pretty-in-pink-400: #c58db1;
--color-pretty-in-pink-500: #a97195;
--color-pretty-in-pink-600: #8d577a;
--color-pretty-in-pink-700: #734362;
--color-pretty-in-pink-800: #5c324e;
--color-pretty-in-pink-900: #48253d;
--color-pretty-in-pink-950: #2f1526;
}
Similar palettes
- 5F0021773A688E55AAC964D5F79297FFB4DBMerguez to Lavender Candy
- 832C5BA84651A86EBDFF9ABEF9C8FFPleasure to Sugar Chic
- 9C61A6F187BFFFB5D0571B568E2400Crown Jewels to Minotaurus Brown
- 702758D797AD982F3BE5C7F8AA75BDPretty in Prune to Wisteria
- BA84B77558C2FFBAC91F0F1F472569Romanov Mauve to Fading Horizon
- FFC8DFFB856FB767D0884865462E4CSugarwinkle to Sanctum of Shadows
- 6733512B131FD77EBDFBB1D9B04C89Grape to Our Little Secret
- 362336702E45E2A0A5C570C4FFD0C8B15B4AMelanzane to Dried Tomatoes