Discord Dark Mode Colors: Every Hex Code (Background, Chat & UI)
Copy Discord dark mode hex codes—background #313338, sidebar #2B2D31, text #DBDEE1, and blurple accent #5865F2—for UI inspiration and dark theme tokens.
Discord Dark Mode — Quick Copy
Main backgrounds and text tokens from Discord dark theme. Click Copy on any row.
What is the Hex Code for Discord Dark Mode?
The main Discord dark mode background is #313338. That is the hex code most people need first—the warm gray-violet you see behind chat messages. Sidebar panels use #2B2D31; deepest surfaces use #1E1F22. Primary text is #DBDEE1.
Discord Dark Mode Background Color Hex Code
Discord layers three background hex codes so panels read clearly without heavy shadows:
- #313338 — main chat canvas and message area
- #2B2D31 — sidebar, channel list, and server rail
- #1E1F22 — darkest panels, modals, and deep wells
Elevated surfaces such as the message composer use #383A40; dividers use #3F4147. Copy any value from the quick-answer box above or the full table below.
What Color is Discord Dark Mode?
Discord dark mode uses a dark gray (#313338), not pure black. Pure #000000 would crush shadow depth and increase eye strain on long sessions; Discord's warm gray-violet keeps OLED-friendly contrast while letting borders (#3F4147) and hover cards (#383A40) stay visible with only a few percent luminance difference between layers.
Discord Dark Mode Hex Code for Mobile
The same colors apply on mobile Discord. iOS and Android apps use the identical dark theme tokens: background #313338, darker panels #2B2D31, deepest surfaces #1E1F22, and text #DBDEE1. If you are building a mobile chat UI inspired by Discord, paste these hex codes into your React Native, Flutter, or Swift theme file—no separate mobile palette required.
Full Discord Dark Mode Color Palette
Complete Discord dark theme hex list—backgrounds, text, borders, blurple accent, and status colors.
| Swatch | Token | Hex |
|---|---|---|
| Darkest (app frame) | #111214 | |
| Darker background | #1E1F22 | |
| Sidebar / secondary bg | #2B2D31 | |
| Main background | #313338 | |
| Elevated surface | #383A40 | |
| Border / divider | #3F4147 | |
| Text secondary | #B5BAC1 | |
| Text primary | #DBDEE1 | |
| Text header | #F2F3F5 | |
| Blurple accent | #5865F2 | |
| Blurple hover | #4752C4 | |
| Online green | #23A559 | |
| Idle yellow | #F0B232 | |
| DND red | #F23F43 |
How to Use Discord Colors in Your Design
Treat Discord hex codes as a reference architecture, not a brand kit. Map their roles to your tokens: --color-canvas = #313338, --color-surface-raised = #383A40, --color-text-primary = #DBDEE1. Swap blurple (#5865F2) for your product accent while keeping neutral separation logic intact.
Always run text pairs through a WCAG contrast checker: #B5BAC1 secondary text on #313338 passes for large labels but may fail for 14px body copy depending on font weight. Bump to #DBDEE1 or #F2F3F5 when audit tools flag failures. For neutral anchors beyond Discord's warm gray, see our charcoal color code reference and broader dark mode color palette guide.
Discord Color Palette for UI Inspiration
Three ways to adapt Discord dark mode colors for chat apps, dashboards, and community products—without cloning the brand wholesale.
Discord-style chat app
Mirror Discord layer logic: #111214 frame, #2B2D31 sidebar, #313338 message well, #383A40 composer, #5865F2 send button.
Discord + custom brand accent
Keep Discord neutrals for structure; swap blurple for your brand indigo (#6366F1) or teal (#14B8A6) on primary actions only.
Discord-inspired dashboard
Use #1E1F22 for nav, #313338 cards, #B5BAC1 chart labels, #23A559 success and #F23F43 alert—status colors borrowed from Discord semantics.
Why Discord Dark Mode Works
Discord optimizes for long sessions: low-saturation grays reduce eye strain, blurple accents appear only on interactive elements, and status colors (green #23A559, yellow #F0B232, red #F23F43) carry semantic meaning without polluting every surface. Community apps, dev tools, and gaming hubs borrow this pattern because users already understand the visual hierarchy.
For broader dark UI theory—including Material #121212 and accessible token naming—see our dark mode color palette guide.
FAQ
- What is the Discord dark mode background color hex?
- Discord main chat background is #313338. Sidebar and darker panels use #2B2D31. Deepest surfaces use #1E1F22 and #111214. Primary text is #DBDEE1.
- What is the Discord dark mode hex code for text?
- Primary message text is #DBDEE1. Secondary metadata and timestamps use #B5BAC1. Strong headers can use #F2F3F5 on dark backgrounds.
- What is Discord blurple hex code?
- Discord brand accent blurple is #5865F2 with hover/pressed #4752C4. Use it sparingly for links and primary buttons against #313338 backgrounds.
- Can I use Discord colors in my app design?
- Discord hex values are widely referenced for dark UI inspiration. For commercial products, treat them as a starting point—define your own tokens and verify WCAG contrast rather than copying the brand wholesale.
Build your own dark palette
Start from Discord neutrals or generate a custom dark theme with harmonized accents.