Hack the Design System
Microsoft Fluent Design System
Office 365
Windows + Outlook
KIN + Windows Phone


Microsoft Fluent Design System brings the fundamentals of principled design, innovation in technology, and customer needs together as one. It’s a collective approach to creating simplicity and coherence through a shared, open design system across platforms.

Open ecosystem,
open design system.

Microsoft led the industry a decade ago with Metro - a design language inspired by the swiss pioneers,  with a goal of creating coherence to it’s product portfolio. Over the last decade we’ve evolved that design language to keep it relevant, to solve new problems, and adhere to industry standards and platform design paradigms.

Today, design systems are much more than design language, but rather a integral part of the process by which enables product teams to scale a design point of view broadly, efficiently, and effectively - meeting a higher quality bar. Evolving a design system at Microsoft scale means looking at the process of product design as a design problem itself. How do we design and build a system that bring design and engineering together to re-design and build the future of how we build products? Together, as a collective. It’s where the process is as important as the output. 

A design system is an end-to-end story of how an organization builds a digital products. Of course it starts with a point of view, but it is comprised of many workstreams such as toolkits, toolchain, guidelines, and most importantly, it’s directly coupled with front end engineering frameworks, that bring the story to life - from pixels to production code in product.  

Fluent aims to be the modern design-to-code
system of the future.