Who at Microsoft uses Fluent UI? From Word and Excel to PowerBI and Teams, many Microsoft apps utilize Fluent UI functionality.

Swiping left or right on section content navigates to the adjacent section. Pivots are stationary when all pivot headers fit within the allowed space. Pivots carousel when all pivot headers don't fit within the …

A Spinner is an outline of a circle which animates around itself indicating to the user that things are processing. A Spinner is shown when it's unsure how long a task will take making it the …

<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/css/fabric.min.css" /> <link rel="stylesheet" …

Use icons sparingly, for high value commands, and don’t mix icons with selection checks, as it makes parsing commands difficult. Avoid submenus of submenus as they can be difficult to invoke or …

Overview Panels are modal UI overlays that provide contextual app information. They often request some kind of creation or management action from the user. Panels are paired with the Overlay …

<div class="ms-MessageBar ms-MessageBar--warning"> <div class="ms-MessageBar-content"> <div class="ms-MessageBar-icon"> <i class="ms-Icon ms-Icon--Info"></i> </div> <div class="ms …

All command items should have an icon and a label. Commands can render as labels only as well. In smaller widths, commands can just use icon only, but only for the most recognizable and frequently …

Fluent UI Use the official front-end framework for building experiences that fit seamlessly into Microsoft 365.

<div class="ms-PersonaCard"> <div class="ms-PersonaCard-persona"> <div class="ms-Persona ms-Persona--lg"> <div class="ms-Persona-imageArea"> <div class="ms-Persona-initials ms-Persona …