Slider

import { Slider } from "@/components/ui/slider"

<Slider defaultValue={[50]} max={100} step={1} className="w-64" />

<Slider defaultValue={[25, 75]} max={100} step={1} className="w-64" />

<Slider defaultValue={[40]} max={100} step={10} className="w-64" />

<Slider defaultValue={[50]} max={100} step={1} className="w-64" disabled />

npx shadcn@latest add https://solar-ui.com/r/slider.json

npm install @radix-ui/react-slider

"use client"
 
import * as React from "react"
import * as SliderPrimitive from "@radix-ui/react-slider"
import { cn } from "@/lib/utils"
 
// Track with Range, one or more Thumb elements