This palette channels NBC news energy with a confident red, deep blue, and crisp gold that feel broadcast-ready and instantly recognizable. The supporting tones add editorial authority and usability without competing with the main network colors.
This palette channels NBC news energy with a confident red, deep blue, and crisp gold that feel broadcast-ready and instantly recognizable. The supporting tones add editorial authority and usability without competing with the main network colors.
Explore the color systemColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.
The main colors form a triadic broadcast system that feels familiar to news branding while staying sharp and modern. Red, blue, and gold create strong visual hierarchy for headlines, navigation, and calls to action.
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 form a triadic broadcast system that feels familiar to news branding while staying sharp and modern. Red, blue, and gold create strong visual hierarchy for headlines, navigation, and calls to action.
RolesLogo, Btn Primary Bg
Crimson brings urgency and authority, giving the brand a strong news-forward signature.
#D72638215, 38, 56354, 70, 500, 82, 74, 16RolesLink, Btn Secondary Bg
Navy adds trust, stability, and an editorial tone that supports long-form content.
#1F4E7931, 78, 121209, 59, 3074, 36, 0, 53RolesBtn Outlined Border, Btn Outlined Text, Headline
Gold adds broadcast polish and visibility, helping key accents feel premium and memorable.
#D4A017212, 160, 2343, 80, 460, 25, 89, 17The support colors extend the palette with quieter analog tones that keep the system usable across charts, labels, and interface states. They reinforce the news aesthetic without diluting the main NBC-inspired contrast.
RolesIcon, Border
Teal softens the primary contrast and works well for interface details and secondary information.
#2F6F6D47, 111, 109178, 41, 3158, 0, 2, 56RolesDivider, Outline
Bronze adds a muted warm bridge between red and gold, giving separators and outlines a more refined editorial feel.
#8C6239140, 98, 5730, 42, 390, 30, 59, 45Utility colors for backgrounds, text, borders, and balance.
RolesBg Light, Btn Primary Text, Btn Secondary Text
#FFFFFF255, 255, 2550, 0, 1000, 0, 0, 0#F3F4F6243, 244, 246220, 14, 961, 1, 0, 4RolesBg Dark, Text
#11182717, 24, 39221, 39, 1156, 38, 0, 85Copy 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-crimson: #D72638;
--color-navy: #1F4E79;
--color-gold: #D4A017;
--color-teal: #2F6F6D;
--color-bronze: #8C6239;
--color-white: #FFFFFF;
--color-ivory: #F3F4F6;
--color-charcoal: #111827;
}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: #D72638;
--role-btn-primary-bg: #D72638;
--role-link: #1F4E79;
--role-btn-secondary-bg: #1F4E79;
--role-btn-outlined-border: #D4A017;
--role-btn-outlined-text: #D4A017;
--role-headline: #D4A017;
--role-icon: #2F6F6D;
--role-border: #2F6F6D;
--role-divider: #8C6239;
--role-outline: #8C6239;
--role-bg-light: #FFFFFF;
--role-btn-primary-text: #FFFFFF;
--role-btn-secondary-text: #FFFFFF;
--role-bg-dark: #111827;
--role-text: #111827;
}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.{
"crimson": "#D72638",
"navy": "#1F4E79",
"gold": "#D4A017",
"teal": "#2F6F6D",
"bronze": "#8C6239",
"white": "#FFFFFF",
"ivory": "#F3F4F6",
"charcoal": "#111827"
}