Slider

Select values by dragging a handle.

Core Examples

Accessible React components with Base UI and Yumma CSS.

Base

Standard implementation with default configuration.


Disabled

Prevents interaction with reduced visual emphasis.


Shape Examples

Shapes from sharp to fully rounded.

Square

Applies sharp corners with no br-(value).


Squircle

Applies a smooth continuous curve between adjacent corners.


More Examples

Additional variants and interactive states.

Range

Allows selection of a numeric range between two handles.