This palette channels Beyoncé-inspired confidence through a vivid gold, a rich plum, and a luminous rose that feel glamorous, powerful, and performance-ready. The supporting teal and warm copper keep the system balanced, while the neutrals preserve clarity across branding and UI use.
This palette channels Beyoncé-inspired confidence through a vivid gold, a rich plum, and a luminous rose that feel glamorous, powerful, and performance-ready. The supporting teal and warm copper keep the system balanced, while the neutrals preserve clarity across branding and UI use.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors create a stage-lit triadic system that feels radiant, dramatic, and unmistakably premium. Gold leads with star power, plum adds depth and elegance, and rose brings warmth and visual charisma.
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 main colors create a stage-lit triadic system that feels radiant, dramatic, and unmistakably premium. Gold leads with star power, plum adds depth and elegance, and rose brings warmth and visual charisma.
RolesLogo, Btn Primary Bg
This gold sets the signature tone with a regal shine that feels celebratory and iconic.
#D4AF37212, 175, 5546, 65, 520, 17, 74, 17RolesHeadline, Btn Secondary Bg
This plum adds richness and intensity, giving the palette a refined sense of drama.
#6A1B4D106, 27, 77322, 59, 260, 75, 27, 58RolesLink, Btn Outlined Border, Btn Outlined Text
This rose keeps the system expressive and feminine while staying bright enough for accents and calls to action.
#D96C9D217, 108, 157333, 59, 640, 50, 28, 15The support colors extend the glamour of the main palette without competing with it, adding cooler contrast and a warm metallic bridge. They help the system feel polished, versatile, and usable across both editorial and interface contexts.
RolesIcon, Border
This teal cools the palette slightly and improves balance against the warmer, more theatrical main colors.
#3A8D8C58, 141, 140179, 42, 3959, 0, 1, 45RolesDivider, Outline
This copper reinforces the luxurious metallic mood while remaining softer and more restrained than the gold.
#B87333184, 115, 5129, 57, 460, 38, 72, 28Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F2EEE8242, 238, 23236, 28, 930, 2, 4, 5RolesBg Dark, Text, Btn Primary Text
#1B1B1F27, 27, 31240, 7, 1113, 13, 0, 88Copy 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-antique-gold: #D4AF37;
--color-plum: #6A1B4D;
--color-rose: #D96C9D;
--color-teal: #3A8D8C;
--color-copper: #B87333;
--color-white: #FFFFFF;
--color-ivory: #F2EEE8;
--color-charcoal: #1B1B1F;
}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: #D4AF37;
--role-btn-primary-bg: #D4AF37;
--role-headline: #6A1B4D;
--role-btn-secondary-bg: #6A1B4D;
--role-link: #D96C9D;
--role-btn-outlined-border: #D96C9D;
--role-btn-outlined-text: #D96C9D;
--role-icon: #3A8D8C;
--role-border: #3A8D8C;
--role-divider: #B87333;
--role-outline: #B87333;
--role-bg-light: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-bg-dark: #1B1B1F;
--role-text: #1B1B1F;
--role-btn-primary-text: #1B1B1F;
}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.{
"antique-gold": "#D4AF37",
"plum": "#6A1B4D",
"rose": "#D96C9D",
"teal": "#3A8D8C",
"copper": "#B87333",
"white": "#FFFFFF",
"ivory": "#F2EEE8",
"charcoal": "#1B1B1F"
}