Microsoft
Microsoft corporate palette anchored on the four-quadrant logo colors (Red #F25022, Green #7FBA00, Blue #00A4EF, Yellow #FFB900) and on Microsoft Communications Blue (#0078D4) — the Fluent / Office system primary used across product UI, the corporate marketing site, and the Microsoft.com chrome.
12 swatches 14 light roles 14 dark roles
Swatches
microsoft-red
#F25022
Top-left quadrant of the Microsoft four-square logo. Used for Office, PowerPoint, and the warm corner of the corporate mark.
microsoft-green
#7FBA00
Top-right quadrant. Associated with Excel and the productivity side of the brand. (Sometimes also documented as #7CBB00.)
microsoft-blue
#00A4EF
Bottom-left quadrant of the logo — Windows blue, lighter than the Communications primary.
microsoft-yellow
#FFB900
Bottom-right quadrant. Often associated with Microsoft Build / developer surfaces.
communications-blue
#0078D4
Microsoft's primary communications blue — the Fluent system primary used across Microsoft 365, the corporate site, and product UI chrome.
microsoft-black
#000000
Wordmark fill and primary text on light backgrounds.
microsoft-near-black
#1F1F1F
Softer near-black for body text and dark surfaces.
microsoft-gray-160
#605E5C
Secondary text and inactive UI (Fluent Neutral Foreground 2).
microsoft-gray-130
#8A8886
Tertiary text and dividers (Fluent Neutral Foreground 3).
microsoft-gray-30
#EDEBE9
Subtle surface tint (Fluent Neutral Background 3).
microsoft-gray-20
#F3F2F1
Page-level background (Fluent Neutral Background 2).
microsoft-white
#FFFFFF
Base background and reversed text on chromatic surfaces.
Mode role mappings
Light mode (14 roles)
accent
→ microsoft-blue accent-hover
→ communications-blue background
→ microsoft-white error
→ microsoft-red primary
→ communications-blue primary-hover
→ microsoft-blue success
→ microsoft-green surface
→ microsoft-gray-20 surface-elevated
→ microsoft-white text-primary
→ microsoft-near-black text-secondary
→ microsoft-gray-160 text-tertiary
→ microsoft-gray-130 warning
→ microsoft-yellow warning-hover
→ microsoft-red Dark mode (14 roles)
accent
→ communications-blue accent-hover
→ microsoft-blue background
→ microsoft-near-black error
→ microsoft-red primary
→ microsoft-blue primary-hover
→ communications-blue success
→ microsoft-green surface
→ microsoft-black surface-elevated
→ microsoft-gray-160 text-primary
→ microsoft-white text-secondary
→ microsoft-gray-30 text-tertiary
→ microsoft-gray-130 warning
→ microsoft-yellow warning-hover
→ microsoft-red Provenance
- Source
- https://fluent2.microsoft.design/color
- License
Proprietary — All Rights Reserved- Attribution
- Microsoft, the Microsoft logo, Fluent, Windows, and related marks are trademarks of the Microsoft group of companies. Brand colors documented here are published on the Microsoft brand resource center (microsoft.com/design/) and the Fluent 2 design system site (fluent2.microsoft.design).
- Imported
-
2026-05-17 - Notes
- Brand-atoms' read of Microsoft's public Fluent 2 color system and the four-quadrant logo color spec. This file is not an official Microsoft brand document; consult fluent2.microsoft.design and the Microsoft Trademark & Brand Guidelines for the canonical source. Microsoft's Fluent palette is much larger than this atom — only the brand-defining hues plus a baseline neutral ramp are surfaced here for cross-product identity work.