Change Default Color to Switch

Radzen.Blazor Components
1

Hi everyone,

does anyone know how to style the Switch element?

In particular I would like to give it a Red-Green color for the off-on selection, but I am unable to do it.

I tryed to set the background or the background-color to a one I want but it seems to me that what I do changes the background color of the whole switch not the default switch color.

RadzenSwitch style="background-color: darkgreen;"

I wold love to have the darkgreen color replace the default light blue color.

Does anyone know how to proceed?

2

Hi @Alten,

You can use the following CSS selector to change the "selected" background:

.rz-switch.rz-switch-checked .rz-switch-circle { 
   background: red !important;
}

And to set the unchecked background use this:

.rz-switch .rz-switch-circle { 
   background: green !important;
}