Palette
Dark, mysterious purples mixed with an ethereal glow, like a hidden cave filled with shimmering crystals.
Preview
Interface
A quick look at how Enchanted Crystal Cave reads on buttons, badges, and alerts before you commit.
Marketing banner
A bolder treatment that stretches the primary and secondary colors across a full gradient banner.
Data visualization
Palette guide
The Enchanted Crystal Cave palette (version 2) blends dark, mysterious purples with ethereal light tones, including deep eggplant #522C68, rich amethyst #854E8D, soft mauve #B484AF, and airy lavender #E1CDEC, complemented by a shimmering light blue #7DCCDE. This collection evokes a hidden cave filled with luminous crystals, perfect for mystical and elegant designs. It offers designers a sophisticated array to create enchanting and luxurious visual experiences.
primary
Use #522C68 as a deep, grounding purple for strong foundations or atmospheric backgrounds.
secondary
Apply #854E8D for rich, supportive mid-purples in content areas or larger graphical elements.
accent
Incorporate #7DCCDE as a cool, shimmering highlight for interactive elements or subtle glows.
background
Utilize #E1CDEC for light, ethereal backgrounds that enhance the palette's mystical mood.
text
For light backgrounds like #E1CDEC, use dark grey or black. For dark colors like #522C68, opt for white or light grey.
Creates a mysterious, layered depth for backgrounds, strong branding, or evocative visuals.
#522C68 · #854E8D · #B484AFOffers a light, ethereal blend for delicate elements, subtle highlights, and magical effects.
#7DCCDE · #E1CDEC · #B484AFProvides a strong primary with a cool accent, suitable for headers, key elements, and impactful branding.
#522C68 · #7DCCDE · #854E8D:root {
--enchanted-crystal-cave-2-1: #522C68;
--enchanted-crystal-cave-2-2: #854E8D;
--enchanted-crystal-cave-2-3: #B484AF;
--enchanted-crystal-cave-2-4: #E1CDEC;
--enchanted-crystal-cave-2-5: #7DCCDE;
}theme: {
extend: {
colors: {
"enchanted-crystal-cave-2": {
1: "#522C68",
2: "#854E8D",
3: "#B484AF",
4: "#E1CDEC",
5: "#7DCCDE",
}
}
}
}Palette colors
Accessibility
Similar palettes