Skip to content
SLIDERS AND RATING · FREE

Slider

Choose a number by dragging.

Drag to choose a number in a range, for values that are easier to feel than to type.

Why it helps

  • Natural dragging
  • Marks on the track
  • Keyboard support

Where it fits

  • Volume and brightness
  • Price range
  • Zoom
Slider control in a RayCraft page

Example

<Slider @bind-Value="_volume" Label="Volume" />
<Slider @bind-Value="_temperature" Label="Temperature" Min="-10" Max="10" Step="0.5" />

@code {
    private double _volume = 40;
    private double _temperature = 2.5;
}

A short fragment. Add @using RayCraft.Blazor.Components to your page and use an interactive render mode.

Included in RayCraft Free. Working examples are in the GitHub repository (MIT); it holds example and demo code, not the library code.

All controls ยท Documentation