Palette
Shimmering shades of teal and light blue, reminiscent of mystical dewdrops glinting in an enchanted forest.
Preview
Interface
A quick look at how Enchanted Dewdrop Jewel 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 Dewdrop Jewel palette features shimmering shades of teal and light blue, from the deep #1E3B3B to the almost transparent #CFFEFF. This collection, reminiscent of mystical dewdrops glinting in an enchanted forest, offers a fresh yet profound aesthetic. It’s ideal for designers creating designs that evoke magic, tranquility, and a sense of preciousness, perfect for both digital and print applications requiring a cool, ethereal touch.
primary
Use #1E3B3B as a deep, mysterious anchor teal for strong foundations or atmospheric backgrounds.
secondary
Apply #3B6B6B for rich, supportive mid-teal tones in content areas or larger graphical elements.
accent
Incorporate #9BDCDD as a light, shimmering highlight for interactive elements or subtle glows.
background
Utilize #CFFEFF for airy, ethereal backgrounds that enhance the palette's mystical mood.
text
For light backgrounds like #CFFEFF, use dark charcoal or black. For dark colors like #1E3B3B, opt for white or light grey.
Creates a profound, mysterious depth for backgrounds, strong branding, or evocative visuals.
#1E3B3B · #3B6B6B · #6B9B9BOffers a light, ethereal blend for delicate elements, subtle highlights, and magical effects.
#9BDCDD · #CFFEFF · #6B9B9BProvides a strong primary with a cool accent, suitable for headers, key elements, and impactful branding.
#1E3B3B · #CFFEFF · #9BDCDD:root {
--enchanted-dewdrop-jewel-1: #1E3B3B;
--enchanted-dewdrop-jewel-2: #3B6B6B;
--enchanted-dewdrop-jewel-3: #6B9B9B;
--enchanted-dewdrop-jewel-4: #9BDCDD;
--enchanted-dewdrop-jewel-5: #CFFEFF;
}theme: {
extend: {
colors: {
"enchanted-dewdrop-jewel": {
1: "#1E3B3B",
2: "#3B6B6B",
3: "#6B9B9B",
4: "#9BDCDD",
5: "#CFFEFF",
}
}
}
}Palette colors
Accessibility
Similar palettes