Skip to content

Latest commit

 

History

History
16 lines (13 loc) · 793 Bytes

README.md

File metadata and controls

16 lines (13 loc) · 793 Bytes

Microsoft Fluent Design Acrylic Material

This recreates the Acrylic material which can be found throughout the Windows 10 UI. It involves multiple layers, including:

  • Background
  • Saturation boost
  • Gaussian blur
  • Exclusion blend
  • Color overlay (currently only white, dark mode coming soon)
  • Tiled noise texture

As you can see in the picture, Microsoft uses the same layers in the same order: Reference A possible result using the acrylic.css and only one div-container is shown below: Screenshot