Instagram Dark Mode Colors: #000000
What is the Instagram dark mode hex code?
Instagram dark mode uses true black #000000 background, #121212 surfaces, #262626 elevated menus, #FFFFFF text, and #0095F6 blue. The story-ring gradient runs #FEDA77 → #DD2A7B → #515BD4.
- Background: #000000
- Blue: #0095F6
- Magenta: #DD2A7B
Copy Instagram dark mode hex codes—background #000000, surface #121212, blue #0095F6, and the signature gradient—for UI inspiration and dark theme tokens.
Instagram Dark Mode — Quick Copy
Backgrounds, blue accent, and text tokens from Instagram dark theme. Click Copy on any row.
What is the Hex Code for Instagram Dark Mode?
Instagram dark mode uses true black #000000 for the main background—ideal for OLED screens and making photos pop. Cards and feed surfaces use #121212; elevated menus and dialogs use #262626. Primary text is #FFFFFF with secondary captions in #A8A8A8.
Instagram Blue & Action Colors
The primary action blue—Follow buttons, links, and active states—is #0095F6 (rgb(0, 149, 246)). Likes, notifications, and errors use red #ED4956. Keep these for interactive moments so they hold meaning against the black surfaces.
Instagram Gradient Hex Codes
Instagram’s signature story-ring gradient flows through five hues: #FEDA77 (yellow), #F58529 (orange), #DD2A7B (magenta), #8134AF (purple), and #515BD4 (blue). Copy them from the gradient table below.
Full Instagram Dark Mode Color Palette
Backgrounds, text, blue action color, and error red for Instagram dark UI.
| Swatch | Token | Hex |
|---|---|---|
| Main background | #000000 | |
| Surface / card | #121212 | |
| Secondary surface | #1A1A1A | |
| Elevated surface | #262626 | |
| Border / divider | #363636 | |
| Text primary | #FFFFFF | |
| Text secondary | #A8A8A8 | |
| Primary blue | #0095F6 | |
| Blue pressed | #1877F2 | |
| Error red | #ED4956 |
Instagram Gradient Hex Codes
The five-stop story-ring gradient used for avatars and brand accents.
| Swatch | Token | Hex |
|---|---|---|
| Gradient yellow | #FEDA77 | |
| Gradient orange | #F58529 | |
| Gradient magenta | #DD2A7B | |
| Gradient purple | #8134AF | |
| Gradient blue | #515BD4 |
How to Use Instagram Colors in Your Design
Map Instagram’s roles to tokens: --color-canvas = #000000, --color-surface = #121212, --color-accent = #0095F6. Use the gradient sparingly—rings, badges, hero moments—so it stays special.
True black saves battery on OLED but can cause smearing during scroll; some teams prefer #121212. Verify text pairs with a WCAG contrast checker, and compare with Discord and Spotify dark palettes.
Instagram Color Palette for UI Inspiration
Three ways to adapt Instagram dark mode colors for social, media, and creator products.
Instagram-style social app
Mirror IG layers: #000000 true-black canvas, #121212 cards, #262626 menus, #0095F6 follow button, #A8A8A8 captions.
Instagram gradient accent
Use the story-ring gradient (#FEDA77 → #DD2A7B → #515BD4) for avatars, badges, and hero moments over near-black surfaces.
Instagram-inspired media dashboard
Use #000000 canvas, #121212 cards, #262626 panels, #0095F6 primary actions, and #ED4956 for alerts and engagement.
Why Instagram Dark Mode Works
Instagram uses true black so photos and videos become the entire experience, with UI chrome nearly invisible until needed. The blue action color and vivid story gradient are the only strong hues, which keeps user content the hero. Social and creator apps borrow this contrast-forward pattern.
For more dark UI theory and accessible token naming, see our dark mode color palette guide.
FAQ
- What is the Instagram dark mode background color hex code?
- Instagram dark mode uses true black #000000 for the main background, with cards and surfaces at #121212 and elevated menus at #262626. Primary text is #FFFFFF and secondary text is #A8A8A8.
- What is the Instagram blue hex code?
- Instagram’s primary action blue (Follow button, links) is #0095F6, rgb(0, 149, 246). A pressed/alternate blue is #1877F2.
- What are the Instagram gradient hex codes?
- The Instagram story-ring gradient runs through #FEDA77 (yellow), #F58529 (orange), #DD2A7B (magenta), #8134AF (purple), and #515BD4 (blue). Use it for avatars, badges, and brand accents.
- Can I use Instagram colors in my own app design?
- Instagram hex values are widely referenced for true-black social UI. For commercial products, treat them as inspiration—define your own tokens, use the gradient sparingly, and verify WCAG contrast.
Build your own dark palette
Start from Instagram neutrals or generate a custom dark theme with harmonized accents.