Skip to content
Search

Fluent Design System

lastmod 2026-04-10created 2023-05-302 edits

Fluent Design System (codename: Project Neon), officially Microsoft Fluent Design System, is a design language developed by Microsoft in 2017.

Fluent Design is a revamp of Microsoft Design Language 2, which includes guidelines for the design and interaction of software designed for all Windows 10 devices and platforms. The system is based on five key components: Light, Depth, Motion, Material, and Scale. The new design language makes more prominent use of motion, depth, and translucency effects.

The transition to Fluent is a long-term project. Preliminary aspects of the design (notably the "Acrylic" translucency effect and the "reveal" effect on buttons) were integrated into Windows 10, especially the "Fall Creators Update" released in October 2017, and were also applied to the Xbox One system software update released alongside it. More aspects of Fluent are expected to be introduced to Windows over time.

Microsoft Fluent 2 design system

Next-generation design system that improves on Fluent 1

  • Consistent color system: three color palettes - Neutral (black/white/gray), Shared (shared by 365 and various apps), Brand (specifies the brand color for each product)
  • Token system: instead of pixel sizes or hex values, color, typography, spacing, elevation, etc. are expressed as Tokens
  • Standardized corners: default corner radius is 4 pixels, 2 pixels for objects smaller than 32 pixels, 8/12 pixels for large objects
  • Customizable, strong usage guidelines, accessibility notation, etc.

See also

Favorite site

author Zer0 sitemap