Button

Demonstration and configuration of the Radzen Blazor Button component.

These demos showcase buttons with various variants (filled/flat/outlined/text), multiple content types (text/icons/images), different sizes (ExtraSmall/Small/Medium/Large), FAB-like styling, disabled states, and busy indicators.

Filled Buttons link

These are the default Radzen Buttons.

Flat Buttons link

Use Variant="Variant.Flat" for flat button variant.

Outlined Buttons link

Use Variant="Variant.Outlined" for outlined button variant.

Text Buttons link

Use Variant="Variant.Text" for text button variant.

Content in Buttons link

Text, icons and images can be added to a button.

• Example
• Edit Source

Icon only button

add_circle add_circle refresh privacy_tip check_circle warning_amber report

Icon and text button

add_circleAdd New add_circleAdd New refreshRefresh privacy_tipPrivacy tip check_circlePublish warning_amberWarning reportReport

Images

Button with content

Button Sizes link

Use the Size property to set button size. Available sizes are ExtraSmall, Small, Medium (default), and Large.

FAB-like button link

See how you can achieve Floating action button look and feel. See also the standalone RadzenFab and RadzenFabMenu components.

Disabled Button link

Use Disabled="true" to disable a button.

Busy button link

Use IsBusy="true" to show the busy indicator.

Keyboard Navigation link

The following keys or key combinations provide a way for users to navigate and interact with Radzen Blazor Button component.

All the tools in one place

Save Hours on Every Project

With Radzen Blazor subscription you get the full toolkit, including:

support

Dedicated support backed by proven expertise

palette

Premium themes and theme editor

widgets

Ready-to-use UI blocks

dashboard_customize

Complete app templates

format_shapes

Visual design-time-experience

Start Free See Subscription Plans

Radzen Blazor Components, © 2018-2025 Radzen.
Source Code licensed under MIT