Radzen Blazor Components

SplitButton

Demonstration and configuration of the Radzen Blazor SplitButton component.

Filled SplitButton link

These are the default Radzen SplitButton.

Filled

Filled Shades





Filled Light and Dark

Light and Dark button styles don't have Shades

Outlined SplitButton link

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

Outlined

Outlined Shades





Outlined Light and Dark

Text SplitButton link

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

Text

Text Shades




Text Light and Dark

Content in SplitButton link

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

SplitButton Sizes link

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

Disabled SplitButton link

Use Disabled="true" to disable a split button.

Disabled SplitButton

Busy SplitButton link

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

AlwaysOpenPopup SplitButton link

Use AlwaysOpenPopup="true" to open popup with items on click.

Always open popup with items on click

Keyboard Navigation link

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

Press this key To do this
Tab Navigate to the SplitButton.
Alt + Down Arrow Open/Close SplitButton popup.
Down Arrow on closed popup Select next SplitButton item.
Up Arrow on closed popup Select previous SplitButton item.
Space or Enter on opened popup Selects the focused SplitButton item and closes the popup.
Escape Closes the SplitButton popup.
Space or Enter Clicks SplitButton.

Supercharge your Blazor development with Radzen Blazor Studio

Radzen Blazor Studio is a software development environment that empowers developers to design, build and deploy Blazor applications without the traditional hurdles. Write less code and get more done.

open_in_new Learn More
>Radzen Blazor Studio

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

Demos Configuration

Premium Themes

  • Material 3
  • Fluent
  • Material 3 Dark
  • Material Dark
  • Fluent Dark

Free Themes

  • Material
  • Standard
  • Default
  • Humanistic
  • Software
  • Dark
An error has occurred. This app may no longer respond until reloaded. Reload 🗙