Dota 2 color palette
GamingDota 2's color identity is defined by its deep, battle-worn red and dark, moody neutrals, reflecting the game's intense and atmospheric style. The palette is consistent across its website, client UI, and promotional materials.
dota2.comDota 2 colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Dota RedPrimary191, 46, 26
- Dire BlackSecondary26, 26, 26
- Radiant GoldAccent231, 163, 75
Surfaces
Page, cards and dividers.- Ancient SlateBackground24, 24, 24
- Fog of War GraySurface35, 35, 35
- Rune BorderBorder60, 60, 60
Text
Three tiers of copy.- Scroll ParchmentText244, 233, 214
- Spectator GraySecondary text184, 184, 184
- Creep GrayMuted text122, 122, 122
Semantic
Feedback and state colors.- Victory GreenSuccess107, 191, 71
- Warning AmberWarning243, 193, 58
- Defeat RedError217, 72, 59
- Info BlueInfo74, 144, 226
Use Dota 2's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
dota-2-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #4A90E2;
--error: #D9483B;
--accent: #E7A34B;
--border: #3C3C3C;
--primary: #BF2E1A;
--success: #6BBF47;
--surface: #232323;
--warning: #F3C13A;
--secondary: #1A1A1A;
--text-muted: #7A7A7A;
--background: #181818;
--text-primary: #F4E9D6;
--text-secondary: #B8B8B8;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
14.8:1
Pass
Text on surface
Needs 4.5:1 for body text
13.1:1
Pass
Secondary text on background
Needs 4.5:1 for body text
9.0:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.9:1
Pass
Muted text on background
Needs 3:1 for large text
4.1:1
Pass
Muted text on surface
Needs 3:1 for large text
3.7:1
Pass
Dota 2 background, border and text colors
Dota 2 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.
- Ancient SlateBackground
- HEX
- RGB
- HSL
- Fog of War GraySurface
- HEX
- RGB
- HSL
- Rune BorderBorder
- HEX
- RGB
- HSL
- Scroll ParchmentText
- HEX
- RGB
- HSL
- Spectator GraySecondary text
- HEX
- RGB
- HSL
- Creep GrayMuted text
- HEX
- RGB
- HSL
About Dota 2's colors
Dota 2's palette is anchored by a rich red, complemented by dark neutrals and gold accents to evoke a sense of ancient conflict and fantasy. The colors are chosen for high contrast and thematic resonance with the game's lore.
Primary red contrasts with gold accent for visual hierarchy.
Dark backgrounds enhance readability and focus.
Neutral grays support UI clarity and mood.
Psychology
The dominant red conveys intensity, urgency, and the combative spirit of Dota 2. Gold and parchment tones add a sense of legacy and reward, while deep grays create a mysterious, immersive atmosphere.
Evolution
Dota 2's palette has remained largely stable since launch, with minor adjustments to neutral tones for improved UI clarity. The signature red and gold have been consistent in branding and in-game visuals.
Where Dota 2 uses each color
- Primary
Dota Red is used for main buttons, highlights, and the logo.
- Secondary
Dire Black appears in navigation bars, modal backgrounds, and the game client UI.
- Accent
Radiant Gold is used for rewards, highlights, and special event banners.
- Backgrounds
Ancient Slate and Fog of War Gray are the main backgrounds for website and in-game menus.
- Text
Scroll Parchment is used for primary text, with Spectator Gray and Creep Gray for secondary and muted text.
- Semantic
Victory Green, Warning Amber, Defeat Red, and Info Blue are used for status indicators and notifications.
Dota 2 color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Dota 2 primary color is #BF2E1A, known as Dota Red. This is used in the logo and major UI elements.
Dota Red (#BF2E1A) is RGB(191, 46, 26) and CMYK(0, 76, 86, 25). Use these values for print and digital consistency.
Dota 2 uses #1A1A1A (Dire Black), #181818 (Ancient Slate), and #232323 (Fog of War Gray) for backgrounds and UI surfaces. These create the game's signature dark, immersive look.
Use Dota Red (#BF2E1A) for primary actions and branding, with gold and parchment for highlights and readable text. Dark neutrals should dominate backgrounds to maintain the game's atmospheric style.
The secondary color is Dire Black, #1A1A1A, and the accent is Radiant Gold, #E7A34B. 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 Dota 2's colors consistently when it generates UI.
Make something in the spirit of Dota 2
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.