Slider
Svelte
<!-- Single value slider -->
<Slider value={30} />
<Slider value={50} palette="success" rounded />
<!-- All palettes -->
<Slider value={60} palette="accent" />
<Slider value={60} palette="tone" />
<Slider value={60} palette="error" />
<Slider value={60} palette="warning" />
<Slider value={60} palette="success" />
<Slider value={60} palette="info" />
<Slider value={60} palette="neutral" /> API
| Prop | Type | Default |
|---|---|---|
| value | number | 0 |
| value_end | number | 100 |
| range | boolean | false |
| min | number | 0 |
| max | number | 100 |
| step | number | 1 |
| palette | "accent" | "tone" | "neutral" | "error" | "warning" | "success" | "info" | "accent" |
| size | "sm" | "md" | "lg" | "md" |
| elevation | "none" | "subtle" | "hard" | "none" |
| outlined | boolean | false |
| rounded | boolean | false |
| disabled | boolean | false |
| aria_label | string | undefined |
Prop value
Type
numberDefault
0Prop value_end
Type
numberDefault
100Prop range
Type
booleanDefault
falseProp min
Type
numberDefault
0Prop max
Type
numberDefault
100Prop step
Type
numberDefault
1Prop palette
Type
"accent" | "tone" | "neutral" | "error" | "warning" | "success" | "info"Default
"accent"Prop size
Type
"sm" | "md" | "lg"Default
"md"Prop elevation
Type
"none" | "subtle" | "hard"Default
"none"Prop outlined
Type
booleanDefault
falseProp rounded
Type
booleanDefault
falseProp disabled
Type
booleanDefault
falseProp aria_label
Type
stringDefault
undefined