sigilUI

Slider

Adjust a numeric value along a draggable track.

@sigil-ui/componentsReact

Preview

Live preview Interactive

Import

import { Slider } from "@sigil-ui/components";

Usage

<Slider aria-label="Progress" defaultValue={[50]} />

Token integration

CSS VariablePurpose
--s-border-styleBorder style
--s-primaryPrimary
--s-backgroundBackground
--s-shadow-smShadow sm
--s-radius-fullRadius full
--s-duration-fastDuration fast
--s-ringRing
--s-border-mutedBorder muted
--s-surfaceSurface