Miami Heat color palette
SportsThe Miami Heat brand color system is defined by bold, high-contrast tones: a vibrant red, deep black, and striking yellow accent, reflecting the team's fiery identity. The palette is consistent across digital, print, and apparel applications.
nba.comMiami Heat colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Heat RedPrimary152, 0, 46
- Heat YellowSecondary249, 160, 27
- Heat BlackAccent0, 0, 0
Surfaces
Page, cards and dividers.- Heat WhiteBackground255, 255, 255
- Heat Light GraySurface245, 245, 245
- Heat SilverBorder196, 196, 196
Text
Three tiers of copy.- Heat BlackText0, 0, 0
- Heat RedSecondary text152, 0, 46
- Heat Medium GrayMuted text117, 117, 117
Semantic
Feedback and state colors.- Heat GreenSuccess67, 160, 71
- Heat YellowWarning249, 160, 27
- Heat Error RedError211, 47, 47
- Heat BlueInfo25, 118, 210
Use Miami Heat's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
miami-heat-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1976D2;
--error: #D32F2F;
--accent: #000000;
--border: #C4C4C4;
--primary: #98002E;
--success: #43A047;
--surface: #F5F5F5;
--warning: #F9A01B;
--secondary: #F9A01B;
--text-muted: #757575;
--background: #FFFFFF;
--text-primary: #000000;
--text-secondary: #98002E;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
21.0:1
Pass
Text on surface
Needs 4.5:1 for body text
19.3: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
8.1:1
Pass
Muted text on background
Needs 3:1 for large text
4.6:1
Pass
Muted text on surface
Needs 3:1 for large text
4.2:1
Pass
Miami Heat background, border and text colors
The quiet part of the Miami Heat palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Heat WhiteBackground
- HEX
- RGB
- HSL
- Heat Light GraySurface
- HEX
- RGB
- HSL
- Heat SilverBorder
- HEX
- RGB
- HSL
- Heat BlackText
- HEX
- RGB
- HSL
- Heat RedSecondary text
- HEX
- RGB
- HSL
- Heat Medium GrayMuted text
- HEX
- RGB
- HSL
About Miami Heat's colors
Miami Heat's color palette is built on high-impact, energetic hues that evoke intensity and passion. The combination of red, yellow, and black creates a visually striking and easily recognizable identity.
Red and yellow form a warm, energetic contrast.
Black grounds the palette, providing depth and boldness.
White and gray neutrals balance the vivid primaries.
Psychology
Red symbolizes energy, aggression, and excitement, aligning with the team's competitive spirit. Yellow adds vibrancy and optimism, while black communicates strength and authority.
Evolution
The Miami Heat palette has remained largely stable since the team's inception, with minor adjustments for digital clarity. The core red, yellow, and black have consistently defined the brand.
Where Miami Heat uses each color
- Primary
Heat Red is used on jerseys, logos, and primary navigation elements.
- Secondary
Heat Yellow appears in logo flames, accent graphics, and highlight details.
- Accent
Heat Black is featured in the logo, uniforms, and as a dominant background color.
- Backgrounds
Heat White is used for website backgrounds and print materials.
- Text
Heat Black and Heat Red are used for primary and secondary text on digital and print assets.
- Semantic
Heat Yellow and Heat Green are used for alerts and positive status indicators in digital interfaces.
Miami Heat color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Miami Heat primary brand color is Heat Red, hex code #98002E.
Heat Red (#98002E) in RGB is (152, 0, 46) and in CMYK is (0, 100, 70, 40).
The Miami Heat uses Heat White (#FFFFFF), Heat Light Gray (#F5F5F5), and Heat Silver (#C4C4C4) for neutral backgrounds and UI elements.
Heat Red (#98002E) should dominate primary branding, with Heat Yellow (#F9A01B) and Heat Black (#000000) as accents. Neutrals and supporting colors are reserved for backgrounds, borders, and text.
The secondary color is Heat Yellow, #F9A01B, and the accent is Heat Black, #000000. 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 Miami Heat's colors consistently when it generates UI.
Make something in the spirit of Miami Heat
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.