Attribution

Windows, Windows Media Player, Segoe UI, Aero and Metro are trademarks of Microsoft Corporation. This project is not affiliated with, endorsed by, or sponsored by Microsoft. It ships no Microsoft code and no Microsoft fonts — the stylesheet names faces and falls back to whatever the machine already has. Every value here was measured, or read from published documentation, and written from scratch. What is recorded are facts about a thing that shipped: a control is twenty-three pixels tall, a button face was #f2f2f2. Recording a measurement is not the same as copying the thing measured, and that distinction is most of what this project is.

The disc

One exception, and it should be named rather than left for someone to notice.

The installation disc is not original artwork. It is a photograph of a Windows NT Win32 SDK CD, found on the web, with the wording changed: Software Development Kit became CSS Development Kit, and the starburst lists the eras where it used to list Windows NT 3.1. The disc, its typeface and its layout are Microsoft's. Only the joke is mine.

I have not traced the photographer, and I hold no licence for the image. If it is yours, tell me and I will credit it or take it down.

Where this started

I wanted a stylesheet that made a web page look a little like Windows Media Player 12. A short search turned up WMPotify by Ingan121 — a theme that rebuilds Media Player inside Spotify, carrying a separate control set for Aero, Luna, Classic and Windows 10.

Reading it, the interesting part turned out not to be Media Player. It was the shell underneath: the metrics, the bevels and the palette that every Windows application inherited whether it wanted to or not. So the question moved from one application to the window it sat in, and the profile followed.

WMPotify's Windows 10 values are recorded here. The rest was re-derived from documentation and from the eras themselves. Admitted, not assumed.

The method

The structure is CSS Profile's, and its method is borrowed in turn: the layered cascade of ITCSS, the naming of BEM and its BEMIT extension, the tiered design tokens Brad Frost and the W3C drafts set down, the role-per-step scale from Radix, the prose rhythm from Every Layout.

With thanks to Harry Roberts, Stuart Robson, Brad Frost, the Radix team and the W3C design-tokens group — for the work this rests on. And to everyone whose grammar this only writes down.

The licence

The writing and the CSS are released under CC BY 4.0: take them, change them, credit the source. That covers the stylesheets, the templates and the words on this site, and it is the same licence named in the footer of every page and in LICENSE in the repository.

It does not cover the two things above that are not mine to license: Microsoft's trademarks, and the disc photograph.