Skip to content

Slider

stable

Range input slider with min/max/step

Data EntryInteractive/Storybook ↗
import { Slider } from "@danagraph/design-system"
Loading demo…

Props

label
Type stringDefault —

Label text above the slider

showValue
Type booleanDefault —

Display current value beside the label

min
Type numberDefault —

Minimum range value

max
Type numberDefault —

Maximum range value

step
Type numberDefault —

Step increment

value
Type numberDefault —

Controlled value

semantictypeborder
MobileTouch Target

Thumb target should be ≥44px. The default thumb is 20px — increase to 28px on mobile using the size='lg' variant or CSS override.

Design Rationale

This component was designed to express:

Explore Related

Was this helpful?