This palette pairs deep Ink Navy and warm Gold with a restrained Rose Quartz accent to create a luxury system that feels minimal, refined, and memorable. The neutral structure stays crisp and architectural, so the richer colors can signal premium quality without visual clutter.
This palette pairs deep Ink Navy and warm Gold with a restrained Rose Quartz accent to create a luxury system that feels minimal, refined, and memorable. The neutral structure stays crisp and architectural, so the richer colors can signal premium quality without visual clutter.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
Deep navy and warm gold create a classic premium contrast, while the soft rose accent adds a modern touch without disrupting the minimal structure. Together they read as elevated, controlled, and distinctly high-end.
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.
Deep navy and warm gold create a classic premium contrast, while the soft rose accent adds a modern touch without disrupting the minimal structure. Together they read as elevated, controlled, and distinctly high-end.
RolesLogo, Link, Btn Primary Bg
Ink Navy anchors the brand with quiet authority and a tailored, luxury feel.
#1B234027, 35, 64227, 41, 1858, 45, 0, 75RolesBtn Secondary Bg, Btn Outlined Border, Btn Outlined Text
Antique Gold adds a warm metallic note that signals premium craftsmanship and refinement.
#C9A24A201, 162, 7442, 54, 540, 19, 63, 21RolesHeadline
Rose Quartz softens the palette with a restrained modern elegance that keeps the identity from feeling overly formal.
#B98C8A185, 140, 1383, 25, 630, 24, 25, 27The support colors extend the palette with subdued warmth and depth, giving the system flexibility for icons and subtle UI accents. They stay understated so the main navy and gold relationship remains the visual focus.
RolesIcon, Border
Mink Taupe adds a muted warm-gray utility tone that balances the richness of the main colors.
#8C7A6B140, 122, 10727, 13, 480, 13, 24, 45RolesDivider, Outline
Oatmeal provides a soft structural accent that keeps separators visible while preserving the minimal mood.
#D7CFC4215, 207, 19635, 19, 810, 4, 9, 16Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F5F1EA245, 241, 23438, 35, 940, 2, 4, 4RolesBg Dark, Text, Btn Secondary Text
#11111117, 17, 170, 0, 70, 0, 0, 93Copy 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-ink-navy: #1B2340;
--color-antique-gold: #C9A24A;
--color-rose-quartz: #B98C8A;
--color-mink-taupe: #8C7A6B;
--color-oatmeal: #D7CFC4;
--color-white: #FFFFFF;
--color-ivory: #F5F1EA;
--color-charcoal: #111111;
}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: #1B2340;
--role-link: #1B2340;
--role-btn-primary-bg: #1B2340;
--role-btn-secondary-bg: #C9A24A;
--role-btn-outlined-border: #C9A24A;
--role-btn-outlined-text: #C9A24A;
--role-headline: #B98C8A;
--role-icon: #8C7A6B;
--role-border: #8C7A6B;
--role-divider: #D7CFC4;
--role-outline: #D7CFC4;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-bg-dark: #111111;
--role-text: #111111;
--role-btn-secondary-text: #111111;
}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.{
"ink-navy": "#1B2340",
"antique-gold": "#C9A24A",
"rose-quartz": "#B98C8A",
"mink-taupe": "#8C7A6B",
"oatmeal": "#D7CFC4",
"white": "#FFFFFF",
"ivory": "#F5F1EA",
"charcoal": "#111111"
}