Blazor Toolkit

Blazor ButtonGroup Component

Add the ButtonGroup component to your application as shown in the below code example.

Vertical Orientation

Set the ButtonGroup orientation to vertical by using the property IsVertical="true". This stacks the buttons vertically and can be combined with variants such as e-flat and e-outline.

Selection Type

ButtonGroup can behave like a segmented control with single or multiple selection using the built-in selection model.

Selected: Left
Tags: News
Rounded Buttons

Apply the e-round-corner style to get rounded corners on grouped buttons.

Color Variants

Use semantic styles to represent intent—Primary, Success, Warning, Info, and Error—within a group.

Icons

Use icon-only or icon-with-text buttons inside a group. Provide an aria-label for icon-only groups for accessibility.

States

Showcase disabled and active states inside a ButtonGroup.

Active:

Rejoining the server...

Rejoin failed... trying again in seconds.

Failed to rejoin.
Please retry or reload the page.

The session has been paused by the server.

Failed to resume the session.
Please retry or reload the page.