Blazor Bootstrap: Icon Component Examples
Icons:
<p>
<Icon Name="IconName.Alarm"></Icon>
<Icon Name="IconName.AlarmFill"></Icon>
</p>
Icons with different Sizes:
<p>
<Icon Name="IconName.Alarm" Size="IconSize.x2"></Icon>
<Icon Name="IconName.Alarm" Size="IconSize.x3"></Icon>
<Icon Name="IconName.Alarm" Size="IconSize.x4"></Icon>
<Icon Name="IconName.Alarm" Size="IconSize.x5"></Icon>
</p>
Inline text with icon:
<p>
Inline text <Icon Name="IconName.Alarm" />
</p>
Link with icon:
<p>
<a href="#" class="text-decoration-none">
Example link text <Icon Name="IconName.Alarm" />
</a>
</p>
Link with custom icon
<p>
<a href="#" class="text-decoration-none">
Example link text <Icon CustomIconName="bi bi-bootstrap" />
</a>
</p>
Button with icon and text:
<p>
<Button Color="ButtonColor.Primary"><Icon Name="IconName.Alarm" /> Button </Button>
<Button Color="ButtonColor.Success"><Icon Name="IconName.Alarm" /> Button </Button>
<Button Color="ButtonColor.Danger" Outline="true"><Icon Name="IconName.AlarmFill" /> Button </Button>
</p>
Button with icon only:
<p>
<Button Color="ButtonColor.Secondary"><Icon Name="IconName.Alarm" /></Button>
</p>
Blazor Bootstrap Links:
- Blazor Bootstrap: Quick Start
- Blazor Bootstrap: Alert Component Examples
- Blazor Bootstrap: Buttons Examples
- Blazor Bootstrap: Icons Component Examples
- Blazor Bootstrap: Modal Component Examples
- Blazor Bootstrap: Offcanvas Component Example
- Blazor Bootstrap: Toasts Component Examples
- Blazor Bootstrap: Tooltip Component Examples
-
CreatedDec 09, 2021
-
UpdatedDec 12, 2021
-
Views2,186
Related Articles
Fixed: Blazor Webassembly - Google Authentication Issue - Access to XMLHttpRequest at 'https://login.microsoftonline.com/.well-known/openid-configuration' from origin 'https://localhost:7215' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Blazor Bootstrap: Tooltip Component Examples
Blazor Bootstrap: Alert Component Examples
Blazor Bootstrap: Toasts Component Examples
Blazor Bootstrap: Modal Component Examples
Blazor Bootstrap: Offcanvas examples
Blazor Bootstrap: Button Examples
Blazor Bootstrap: Quick Start
How to migrate Blazor WebAssembly App to .NET 5
Blazor: How to bind employees to table / grid