Styles and Appearances in Blazor RadioButton Component

4 Nov 20251 minute to read

To modify the RadioButton appearance, override the component’s default CSS. The following table lists common CSS selectors and their purposes within the RadioButton. Ensure custom CSS is loaded after the Syncfusion theme so overrides take effect. A custom theme for all controls can also be created using the Theme Studio.

CSS Class	Purpose of Class
.e-radio-wrapper	To customize the radio button wrapper.
.e-radio + label:hover::before	To customize the radiobutton on hover.
.e-radio:checked + label::after, e-radio:checked + label::before	To customize the checked radiobutton.
.e-radio:checked:focus + label::before, .e-radio:checked + label:hover::before	To customize the checked radiobutton on hover.