Open-source, customisable & fully accessible design system – built with Svelte
Diète is made by, and for, free-spirited app makers who want to remain independent. All
components are minimally-designed, built with Svelte 5, easily customisable and comply with the
highest accessibility standards. Check our growing library of open-source UI components, that
you can copy directly into your project.Explore componentsLearn more
Quick preview
0
A simple continuous slider, showing the selected value on the right
0
0
100
Selected value is shown on hover, pressed and focused states
0
Selects a value from a range of predetermined values, marked by stop indicators
0
0
100
Discrete slider can also show minimum and maximum values
-5
Selects a value from a negative/positive range, starting value is in the center
-5
-5
5
Selected value is shown on hover, pressed and focused states
-5
Selects a value from a range of predetermined values, marked by stop indicators
-5
-5
5
Discrete slider can also show minimum and maximum values
0
0
100
100
Selects two values on one slider to create a range
0
0
100
100
Range slider is also available with discrete values