Overview
The Fundamentals product contains various using interface controls that may be used in your applications.
Avatar
![]()
Avatar controls are used to represent people or objects. They can render a full-size image, a centered glyph, a person's initials, or text.
Avatar Group
![]()
Avatar Group renders multiple Avatar controls.
Badge

Badge provides contextual information for other elements or can be used stand-alone.
Card

Card controls are typically used to present visually grouped information for a single subject.
Circular Progressbar

CircularProgressBar displays a ranged progress value using fluent animations. It is similar to a native linear ProgressBar, except that it renders the progress in a ring shape.
Info Bar

Info Bar can be used to display essential information to a user without disrupting the user flow.
Segmented Bar

Segmented Bar allows a user to select a single item with support for fluent animations when changing selection.
Settings Controls

The SettingsCard, SettingsExpander, and SettingsGroup controls are used together to organize and present configurable settings.
Window Control

Window Control is a control that looks and acts like a Window, but can be used anywhere a Control can be used. This is especially useful when developing single-page applications that need Window-like capabilities.
Progress Spinners

Progress Spinners are used when some form of processing is occurring to tell the end user that something is happening.