This palette turns the image’s layered berry, plum, and mauve stacks into a cohesive brand system with a refined, editorial feel. The darker violet anchor adds structure while the brighter magenta and soft rose tones keep the palette energetic and highly recognizable.
This palette turns the image’s layered berry, plum, and mauve stacks into a cohesive brand system with a refined, editorial feel. The darker violet anchor adds structure while the brighter magenta and soft rose tones keep the palette energetic and highly recognizable.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors stay within a berry-to-plum range, creating a coherent identity that feels intentional, glamorous, and easy to recognize across print and digital touchpoints. The contrast comes from value shifts rather than hue conflict, so
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 stay within a berry-to-plum range, creating a coherent identity that feels intentional, glamorous, and easy to recognize across print and digital touchpoints. The contrast comes from value shifts rather than hue conflict, so
RolesLogo, Link, Btn Secondary Bg
A grounded orchid plum that gives the brand a distinctive signature and strong visual authority.
#7A2E6F122, 46, 111309, 45, 330, 62, 9, 52RolesBtn Primary Bg, Headline
A vivid berry magenta that brings energy, modernity, and immediate shelf appeal to calls to action.
#C63AA0198, 58, 160316, 55, 500, 71, 19, 22RolesBtn Outlined Border, Btn Outlined Text
A deep mulberry violet that supports structure and premium contrast without overpowering the brighter accents.
#4A295B74, 41, 91280, 38, 2619, 55, 0, 64These accents extend the berry family with softer tonal bridges and a cooler balancing note, helping layouts feel layered rather than repetitive. They stay subordinate to the mains
RolesIcon, Border
A softened rose accent that lightens interfaces and adds a polished, feminine transition between bold tones and neutrals.
#D98AB5217, 138, 181327, 51, 700, 36, 17, 15RolesDivider, Outline
A restrained amethyst that reinforces the palette’s violet core while providing gentle separation in UI details.
#8D6AAE141, 106, 174271, 30, 5519, 39, 0, 32Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F5F0F4245, 240, 244312, 20, 950, 2, 0, 4RolesBg Dark, Text
#1A132026, 19, 32272, 25, 1019, 41, 0, 87Copy 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-burgundy-orchid: #7A2E6F;
--color-electric-berry: #C63AA0;
--color-midnight-mulberry: #4A295B;
--color-dusty-rose-veil: #D98AB5;
--color-muted-amethyst: #8D6AAE;
--color-pure-white: #FFFFFF;
--color-porcelain-blush: #F5F0F4;
--color-ink-noir: #1A1320;
}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: #7A2E6F;
--role-link: #7A2E6F;
--role-btn-secondary-bg: #7A2E6F;
--role-btn-primary-bg: #C63AA0;
--role-headline: #C63AA0;
--role-btn-outlined-border: #4A295B;
--role-btn-outlined-text: #4A295B;
--role-icon: #D98AB5;
--role-border: #D98AB5;
--role-divider: #8D6AAE;
--role-outline: #8D6AAE;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-bg-dark: #1A1320;
--role-text: #1A1320;
}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.{
"burgundy-orchid": "#7A2E6F",
"electric-berry": "#C63AA0",
"midnight-mulberry": "#4A295B",
"dusty-rose-veil": "#D98AB5",
"muted-amethyst": "#8D6AAE",
"pure-white": "#FFFFFF",
"porcelain-blush": "#F5F0F4",
"ink-noir": "#1A1320"
}