Slider Range

A dual-handle range slider that lets users select a min and max value between 25 and 50 on a 0-100 scale.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Slider Range to your project and fits it to your theme.

import { SliderRange } from "@/components/ui/slider-range";

export default function SliderRangeDemo() {
  return (
    <div className="flex w-full items-center justify-center p-10">
      <SliderRange />
    </div>
  );
}