Blazor Range Slider - Custom Thumb

Range Slider / Customization / Thumb

This sample demonstrates the customization of the Blazor Range Slider thumb. Drag the thumb over the bar to select the values between Min and Max.

Loading Syncfusion Blazor Server Demos…

In this demo, customization of the thumb by changing CSS is demonstrated.

  • Square - In this sample, the thumb has been customized into a square shape.
  • Circle - In this sample, the thumb has been customized into a circle shape.
  • Oval - In this sample, the thumb has been customized into an oval shape.
  • Custom image - In this sample, the thumb has been replaced with a custom image.
Transform your Blazor web apps today with Syncfusion® Blazor components
145+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE