Blazor ToggleButton - Overview

Basic ToggleButton

Icon ToggleButton

Disabled ToggleButton

  • Overview.razor
Loading the demo source code...please wait.

Style in ThemeBuilder

  • Custom SASS variables
  • Atomic customizations
  • Sharing projects
Start Theming
blazor ui ninja image

The ToggleButton component is part of Telerik UI for Blazor, a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.


The Telerik UI for Blazor ToggleButton is a digital switch that offers users a choice between two mutually exclusive options. This two-state button delivers immediate results and indicates the active selection/state. The Telerik UI for Blazor ToggleButtion is a UI element that can be easily designed and styled for your app through built-in themes, click events (OnClick and SelctedChanged) and icons.

With its two-state button design, users can control preferences and easily flip between the two, as needed. When you need to offer more meaningful toggle options, the Telerik UI for Blazor ToggleButton can be used in conjunction with a Checkbox component to deliver data bindable state selection.

There are different approaches you can take to style the Telerik UI for Blazor ToggleButton. You can apply your own CSS class, you can alter the appearance of the button by adding icons, you can change the content through set properties and modify the default set by adding an attribute.

In line with what you’d expect in the Telerik UI for Blazor library, the ToggleButton component supports out-of-the-box keyboard navigation and follows best practices for keyboard interaction. The control also offers support for web accessibility standards and enables access to the component content through assistive technologies such as screen readers and other devices.

Your Telerik UI for Blazor ToggleButton offers support for several built-in themes, including Bootstrap, Material and our own neutral ones referred to as Default. You can easily customize the out-of-the-box themes or build new themes using the Telerik Saas theme builder application. Learn more about the Telerik Saas ThemeBuilder application.

This Blazor ToggleButton Overview example is part of a unique collection of hundreds of Blazor demos, with which you can see all Telerik UI for Blazor components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for Blazor or ThemeBuilder.

Support & Learning Resources

Additional Resources

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