This palette draws from the warm golden background, the striking black owl shape, and the vivid red detailing in the logo to create a confident and recognizable brand color system. The main colors balance strong visual impact with approachable vibrancy, while support accents enhance depth without overpowering.
This palette draws from the warm golden background, the striking black owl shape, and the vivid red detailing in the logo to create a confident and recognizable brand color system. The main colors balance strong visual impact with approachable vibrancy, while support accents enhance depth without overpowering.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The palette unites a warm golden yellow, deep black, and a vivid red in a powerful triadic harmony that ensures brand recognition and striking contrast.
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 palette unites a warm golden yellow, deep black, and a vivid red in a powerful triadic harmony that ensures brand recognition and striking contrast.
RolesLogo, Btn Primary Bg, Link
Goldenrod conveys energy, optimism, and warmth, serving as the vibrant brand foundation.
#F2AA05242, 170, 542, 96, 480, 30, 98, 5RolesBg Dark
Black provides boldness, contrast, and sophistication, grounding the palette with clarity.
#0000000, 0, 00, 0, 00, 0, 0, 100RolesBtn Secondary Bg, Btn Outlined Border, Btn Outlined Text, Headline
Crimson Red adds passion and attention-grabbing vibrancy to highlight key brand elements.
#D72631215, 38, 49356, 70, 500, 82, 77, 16The support colors are softer, muted tones that extend the palette with subtle warmth and help balance the intense main colors for usability.
RolesIcon, Border, Divider, Outline
Light Amber offers a gentle warm highlight that complements Goldenrod while remaining visually subordinate.
#EEC863238, 200, 9944, 80, 660, 16, 58, 7Deep Maroon provides a muted contrast to Crimson Red, adding balance and depth without drawing focus.
#8B1A1A139, 26, 260, 68, 320, 81, 81, 45Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F5F5F5245, 245, 2450, 0, 960, 0, 0, 4RolesText, Btn Primary Text
#1A1A1A26, 26, 260, 0, 100, 0, 0, 90Copy 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-goldenrod: #F2AA05;
--color-black: #000000;
--color-crimson-red: #D72631;
--color-light-amber: #EEC863;
--color-deep-maroon: #8B1A1A;
--color-white: #FFFFFF;
--color-alabaster: #F5F5F5;
--color-jet-black: #1A1A1A;
}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: #F2AA05;
--role-btn-primary-bg: #F2AA05;
--role-link: #F2AA05;
--role-bg-dark: #000000;
--role-btn-secondary-bg: #D72631;
--role-btn-outlined-border: #D72631;
--role-btn-outlined-text: #D72631;
--role-headline: #D72631;
--role-icon: #EEC863;
--role-border: #EEC863;
--role-divider: #EEC863;
--role-outline: #EEC863;
--role-bg-light: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-text: #1A1A1A;
--role-btn-primary-text: #1A1A1A;
}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.{
"goldenrod": "#F2AA05",
"black": "#000000",
"crimson-red": "#D72631",
"light-amber": "#EEC863",
"deep-maroon": "#8B1A1A",
"white": "#FFFFFF",
"alabaster": "#F5F5F5",
"jet-black": "#1A1A1A"
}