Button

Represents a button for actions, links, and commands.

Filled Buttons

Filled Buttons have elevation (box shadow) and is raised on click by default.

<MudButton Variant="Variant.Filled">Default</MudButton>
<MudButton Variant="Variant.Filled" Color="Color.Primary">Primary</MudButton>
<MudButton Variant="Variant.Filled" Color="Color.Secondary">Secondary</MudButton>
<MudButton Variant="Variant.Filled" Disabled="true">Disabled</MudButton>
Text Buttons

Text Buttons have no drop shadow, background or border and only hover effect is used. The Color property only applies to the text.

<MudButton Variant="Variant.Text">Default</MudButton>
<MudButton Variant="Variant.Text" Color="Color.Primary">Primary</MudButton>
<MudButton Variant="Variant.Text" Color="Color.Secondary">Secondary</MudButton>
<MudButton Variant="Variant.Text" Disabled="true">Disabled</MudButton>
Outlined Buttons

Outlined Buttons are similar to Text Buttons except for the border that inherits its color from the set Color property.

<MudButton Variant="Variant.Outlined">Default</MudButton>
<MudButton Variant="Variant.Outlined" Color="Color.Primary">Primary</MudButton>
<MudButton Variant="Variant.Outlined" Color="Color.Secondary">Secondary</MudButton>
<MudButton Variant="Variant.Outlined" Disabled="true">Disabled</MudButton>
An unhandled exception has occurred. See browser dev tools for details. Reload 🗙