Tooltip

Simple Tooltips

<MudTooltip Text="Delete">
    <MudIconButton Icon="@Icons.Material.Filled.Delete" />
</MudTooltip>
<MudTooltip Text="Add">
    <MudFab StartIcon="@Icons.Material.Filled.Add" Color="Color.Secondary" />
</MudTooltip>
Arrow Tooltips

The tooltip can display arrows pointing to its activator, set the Arrow property to true to show them.

<MudTooltip Text="Arrow Left" Arrow="true" Placement="Placement.Left">
    <MudButton>Arrow Left</MudButton>
</MudTooltip>
<MudTooltip Text="Arrow Top" Arrow="true" Placement="Placement.Top">
    <MudButton>Arrow Top</MudButton>
</MudTooltip>
<MudTooltip Text="Arrow Bottom" Arrow="true" Placement="Placement.Bottom">
    <MudButton>Arrow Bottom</MudButton>
</MudTooltip>
<MudTooltip Text="Arrow Right" Arrow="true" Placement="Placement.Right">
    <MudButton>Arrow Right</MudButton>
</MudTooltip>
Colored Tooltips

Tooltips can be displayed in different colors with the Color property.

<MudTooltip Text="Secondary" Color="Color.Secondary" Placement="Placement.Top">
    <MudButton>Secondary</MudButton>
</MudTooltip>
<MudTooltip Text="Tertiary" Color="Color.Tertiary" Placement="Placement.Bottom" Arrow="true">
    <MudButton>Tertiary</MudButton>
</MudTooltip>
<MudTooltip Text="Primary" Color="Color.Primary" Placement="Placement.Top">
    <MudButton>Primary</MudButton>
</MudTooltip>

Copyright © 2020-2024 MudBlazor.

Powered by .NET 8.0.8

An error has occurred. This application may no longer respond until reloaded. Reload 🗙