This distinctive palette combines a rich royal purple and a luminous golden yellow as main colors, embodying creativity, mysticism, and youthful energy. The supporting colors extend the palette with balanced, muted blues and warm ambers, complemented by sophisticated neutral tones that ensure strong contrast and premium elegance across various brand touchpoints.
This distinctive palette combines a rich royal purple and a luminous golden yellow as main colors, embodying creativity, mysticism, and youthful energy. The supporting colors extend the palette with balanced, muted blues and warm ambers, complemented by sophisticated neutral tones that ensure strong contrast and premium elegance across various brand touchpoints.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The royal purple and golden yellow form a complementary color scheme that creates striking visual contrast and balance, fostering a memorable and premium brand identity steeped in creative imagination and mysticism.
Clear roles create a consistent brand experience.Assign existing palette colors to brand, typography, and interface roles.
A compact view of the brand, support, and neutral colors that make up this system.
The royal purple and golden yellow form a complementary color scheme that creates striking visual contrast and balance, fostering a memorable and premium brand identity steeped in creative imagination and mysticism.
RolesLogo, Btn Primary Bg, Btn Outlined Border
Royal Purple conveys creativity, mystery, and sophistication, making it ideal for expressing imagination and artistic depth.
#5D3A8B93, 58, 139266, 41, 3933, 58, 0, 45RolesLink, Btn Secondary Bg, Btn Outlined Text
Golden Yellow imparts youthful energy and warmth, symbolizing innovation, inspiration, and a luminous spirit of fantasy.
#FFD166255, 209, 10242, 100, 700, 18, 60, 0Supporting muted tones in deep blue and warm amber extend the main palette by providing balance and subtle accents without overshadowing the primary brand colors, enriching the palette with depth and versatility.
RolesHeadline, Divider, Border, Icon
Muted Indigo complements Royal Purple with a cooler, softer tone, balancing the palette with a calm yet dignified presence.
#4A558474, 85, 132229, 28, 4044, 36, 0, 48RolesOutline
Warm Amber supports Golden Yellow by introducing a deeper, earthy warmth that reinforces the palette’s premium and magical attributes.
#C9A34A201, 163, 7442, 54, 540, 19, 63, 21Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0RolesBg Dark
#F5F5F5245, 245, 2450, 0, 960, 0, 0, 4RolesText, Btn Secondary Text
#2E2E2E46, 46, 460, 0, 180, 0, 0, 82Copy palette values for design systems, websites, and client handoff.
Use these in CSS when you want every raw palette color available by name. Best for websites, landing pages, and design system variables.
Use when: you need the actual colors.:root {
--color-royal-purple: #5D3A8B;
--color-golden-yellow: #FFD166;
--color-muted-indigo: #4A5584;
--color-warm-amber: #C9A34A;
--color-white: #FFFFFF;
--color-cultured-white: #F5F5F5;
--color-charcoal: #2E2E2E;
}Use these in CSS when colors are assigned to practical jobs like text, buttons, borders, links, and backgrounds.
Use when: you need UI roles, not just swatches.:root {
--role-logo: #5D3A8B;
--role-btn-primary-bg: #5D3A8B;
--role-btn-outlined-border: #5D3A8B;
--role-link: #FFD166;
--role-btn-secondary-bg: #FFD166;
--role-btn-outlined-text: #FFD166;
--role-headline: #4A5584;
--role-divider: #4A5584;
--role-border: #4A5584;
--role-icon: #4A5584;
--role-outline: #C9A34A;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-bg-dark: #F5F5F5;
--role-text: #2E2E2E;
--role-btn-secondary-text: #2E2E2E;
}Use this structured palette data in apps, generators, plugins, or tools that need to read the palette programmatically.
Use when: a developer or app needs data.{
"royal-purple": "#5D3A8B",
"golden-yellow": "#FFD166",
"muted-indigo": "#4A5584",
"warm-amber": "#C9A34A",
"white": "#FFFFFF",
"cultured-white": "#F5F5F5",
"charcoal": "#2E2E2E"
}