Buttons
Fluent-styled buttons for primary actions, icon actions and destructive operations.
Primary Button
The main call-to-action button for a screen.
OpenIcon Button
Compact square button showing only an icon.
OpenDanger Button
For destructive actions like deleting a record.
OpenOutline Action Button
A secondary-action button with a transparent background and a colored border. It fills with a soft tint on hover, so it works next to a primary button without competing with it.
OpenSecondary Button
A secondary action button that pairs with a primary button.
OpenGhost Button
A borderless button for low-priority actions in toolbars and cards.
OpenLink Button
An underlined text button for navigation and learn-more actions.
OpenSuccess Button
A green confirm button for approve, save and submit actions.
OpenPill Button
A fully rounded modern button for chips, tags and friendly CTAs.
OpenWarning Button
Amber filled button for risky confirmations like “Delete all”.
OpenTinted Button
Soft accent-tinted “subtle” button — colored text on a light wash of the accent.
OpenSubtle Button
Neutral, low-emphasis button for secondary actions like “Skip for now”.
OpenDestructive Link Button
Plain red link-style button for “Remove item” style destructive text actions.
OpenXL CTA Button
Large call-to-action button with bigger text and padding — for heroes and dialogs.
OpenSend Button
Primary button with a Send icon — built for comment boxes and message forms.
Open