HBO color palette
MediaHBO's color identity is defined by a bold, high-contrast palette centered on black and white, reflecting its premium, cinematic brand. The palette emphasizes clarity and sophistication across digital and broadcast platforms.
hbo.comHBO colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- HBO BlackPrimary0, 0, 0
- HBO WhiteSecondary255, 255, 255
- HBO Green AccentAccent28, 231, 131
Surfaces
Page, cards and dividers.- HBO Dark BackgroundBackground20, 20, 20
- HBO Surface GraySurface34, 34, 34
- HBO Border GrayBorder51, 51, 51
Text
Three tiers of copy.- HBO Primary TextText255, 255, 255
- HBO Secondary TextSecondary text179, 179, 179
- HBO Muted TextMuted text122, 122, 122
Semantic
Feedback and state colors.- HBO Success GreenSuccess28, 231, 131
- HBO Warning YellowWarning255, 214, 0
- HBO Error RedError255, 46, 46
- HBO Info BlueInfo58, 152, 255
Use HBO's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
hbo-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #3A98FF;
--error: #FF2E2E;
--accent: #1CE783;
--border: #333333;
--primary: #000000;
--success: #1CE783;
--surface: #222222;
--warning: #FFD600;
--secondary: #FFFFFF;
--text-muted: #7A7A7A;
--background: #141414;
--text-primary: #FFFFFF;
--text-secondary: #B3B3B3;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
18.4:1
Pass
Text on surface
Needs 4.5:1 for body text
15.9:1
Pass
Secondary text on background
Needs 4.5:1 for body text
8.8:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.6:1
Pass
Muted text on background
Needs 3:1 for large text
4.3:1
Pass
Muted text on surface
Needs 3:1 for large text
3.7:1
Pass
HBO gray, dark and neutral colors
HBO runs a dark interface, so these grays carry the layout: background, sidebar surfaces, dividers and three tiers of text. Click a value to copy it.
- HBO Dark BackgroundBackground
- HEX
- RGB
- HSL
- HBO Surface GraySurface
- HEX
- RGB
- HSL
- HBO Border GrayBorder
- HEX
- RGB
- HSL
- HBO Primary TextText
- HEX
- RGB
- HSL
- HBO Secondary TextSecondary text
- HEX
- RGB
- HSL
- HBO Muted TextMuted text
- HEX
- RGB
- HSL
About HBO's colors
HBO's palette uses stark contrast between black and white to create a cinematic, premium feel. Accents of green and blue are used sparingly for interactive elements and notifications.
Primary and secondary colors are used for maximum contrast in UI.
Accent colors highlight actions and notifications.
Neutral grays support readability and structure.
Psychology
The dominant black and white scheme conveys authority, luxury, and clarity. Accent colors add vibrancy and guide user attention without disrupting the brand's serious tone.
Evolution
HBO's palette has remained consistent, with black and white as core elements since its inception. Recent digital updates introduced subtle accent colors for modern UI needs.
Where HBO uses each color
- Primary
Used for the HBO logo, navigation bars, and backgrounds on digital platforms.
- Secondary
Applied to text, icons, and as a background for high-contrast elements.
- Accent
Used for buttons, highlights, and interactive states in apps and on the website.
- Backgrounds
Dark gray backgrounds appear in app screens, video players, and overlays.
- Text
Primary and secondary text colors are used for headlines, body copy, and metadata.
- Semantic
Success, warning, error, and info colors are used for notifications, alerts, and status indicators.
HBO color questions
Hex codes, RGB values, neutrals and how to use the palette.
The HBO primary color hex code is #000000, known as HBO Black. It is used for the logo and main backgrounds.
HBO Black (#000000) is RGB(0, 0, 0) and CMYK(0, 0, 0, 100). This ensures deep, true black in both digital and print.
HBO uses a range of dark grays, including #141414 for backgrounds, #222222 for surfaces, and #333333 for borders. These tones support the brand's high-contrast, cinematic look.
Use HBO Black (#000000) and White (#FFFFFF) for primary UI elements and text, with accent colors like #1CE783 for interactive features. Neutrals and semantic colors should be applied for structure and feedback in digital products.
The secondary color is HBO White, #FFFFFF, and the accent is HBO Green Accent, #1CE783. Together with the primary they make up the three brand colors at the top of this page.
6 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies HBO's colors consistently when it generates UI.
Make something in the spirit of HBO
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.