Docs
Slider
Slider
An input where the user selects a value from within a given range.
<script lang="ts">
import { Slider } from "$lib/components/ui/slider/index.js";
</script>
<Slider value={[50]} max={100} step={1} class="max-w-[70%]" />
<script lang="ts">
import { Slider } from "$lib/components/ui/slider/index.js";
</script>
<Slider value={[50]} max={100} step={1} class="max-w-[70%]" />
Installation
npx shadcn-svelte@next add slider
Install bits-ui:
npm i bits-ui -D
Copy and paste the component source files linked at the top of this page into your project.
Usage
<script lang="ts">
import { Slider } from "$lib/components/ui/slider/index.js";
</script>
<Slider value={[33]} max={100} step={1} />
On This Page