Microsoft Brand Guidelines
Four coloured squares, a quiet grey wordmark, and one very persistent myth about what those colours mean.
Aa
Two constants: a four-pane window of colour and a calm humanist wordmark. Homage renderings — a generic four-square motif, deliberately not the Microsoft logo.
Four squares, one window
When Microsoft finally added a symbol to its name in 2012, it borrowed the colours it already owned.
On 23 August 2012, Microsoft unveiled its current logo — its first change in 25 years — designed in-house by its brand team. For the first time, the wordmark gained a symbol: four coloured squares in a 2×2 grid, drawn from the familiar red, green, blue and yellow of the Windows flag. And here’s the fact worth correcting: it’s widely claimed that each square stands for a product (Windows, Office, Xbox, Bing). Microsoft never said that. Its official statement only said the squares “express the company’s diverse portfolio.” The product mapping is a persistent myth — a good reminder to check a “meaning” against the source before repeating it.
From the Blibbet to Pac-Man
Before the squares, Microsoft’s logo went through a disco phase, a striped “O,” and a little slash.
The 1975 original was a groovy, banded wordmark. The early-1980s version featured a stylised striped “O” that staff nicknamed the “Blibbet” (its retirement even prompted a tongue-in-cheek “Save the Blibbet” campaign). Then in 1987, designer Scott Baker gave Microsoft its long-running “Pac-Man” logo: the name in italic Helvetica with a slash cut between the “o” and “s” — meant to suggest speed and emphasise “soft,” but the notch made the O look like it was mid-chomp. That mark ran for about 25 years until the 2012 squares replaced it.
Colour: the four panes
Red, green, blue and yellow — the Windows palette, squared off. Click a swatch to copy the hex.
The four squares use an orange-red, a green, a blue and a yellow. One honest note: Microsoft never published these as official brand hex values, so the numbers below are the widely-cited community standard rather than a figure from a Microsoft spec — but they’re consistent across reputable references. The wordmark itself sits in a neutral grey, letting the colour live entirely in the symbol. Copy the working values below.
Type: Segoe
The wordmark and the software both run on the same humanist sans — one with a controversial past.
The 2012 wordmark is set in Segoe, the same humanist sans Microsoft uses across its products and marketing. Segoe was designed by Steve Matteson at Agfa Monotype and licensed by Microsoft around 2003–2004 to replace Franklin Gothic (branding) and Tahoma (UI). It came with a fight: type foundry Linotype challenged Segoe as too close to its Frutiger, and an EU body invalidated Microsoft’s design registration in 2006 (Microsoft maintained Segoe was independently designed). Today Segoe UI Variable carries the system into the Windows 11 era. The specimen below is set in a comparable humanist sans.
Achieve more
Neutral, humanist and highly legible — a workhorse that reads the same on a billboard and a taskbar. (Specimen set in Open Sans, a humanist sans in Segoe’s spirit.)
Metro, then Fluent
Microsoft’s real design signature isn’t the four squares — it’s two design languages that taught the industry to lead with type and content.
In 2010 Microsoft introduced Metro (later renamed the Modern UI) with Windows Phone and then Windows 8 — a design language that stripped away skeuomorphic gloss in favour of bold typography, flat colour and generous whitespace, taking its cues from the clean pictograms of transit signage. The guiding phrase was “content before chrome”: let the words and pictures carry the interface, and get the decorative furniture out of the way. It was a striking gamble for a company long associated with busy toolbars and dialog boxes, and it put Segoe’s quiet legibility at the very centre of the experience.
In 2017 Microsoft succeeded it with the Fluent Design System, built on five ingredients — light, depth, motion, material and scale — and, a few years later, a friendly rounded icon set that re-drew Office and Windows apps in soft gradients. Fluent’s task was to make a single identity feel coherent across a phone, a laptop, an Xbox and a mixed-reality headset. Taken together, Metro and Fluent explain why Microsoft’s modern look feels calm and roomy rather than cluttered: the four squares may be the badge on the door, but the design language is where the brand actually lives from day to day — the same instinct toward restraint that shaped the 2012 logo, scaled up to an entire software ecosystem.
Explore & save
Keep Microsoft’s system on hand — save it to a board in the Made Good inspiration library.
Microsoft identity set
Pin the four-pane idea, the Windows palette and the humanist type to your own board.


