Slider

Animated slider with spring-snapped thumb, step dots, range mode, and click-to-edit value display. Built on Radix UI Slider.

Library

Fluid Functionalism

Framework

React

Type

ui

License

MIT

Dependencies

@radix-ui/react-slider, motion

Install

npx shadcn@latest add @fluid/slider

Files

• registry/radix/slider.tsx
• registry/default/lib/utils.ts
• registry/default/lib/springs.ts
• registry/default/lib/omit.ts
• registry/default/lib/font-weight.ts
• registry/default/lib/shape-context.tsx
• registry/default/lib/size-context.tsx
• registry/default/lib/type-scale.ts

Source

https://github.com/mickadesign/fluid-functionalism

Categories

• Input Components
• React Input Components
• Tailwind CSS Input Components
• Animated Input Components
• Range Slider Components
• React Range Slider Components
• Tailwind CSS Range Slider Components
• Animated Range Slider Components
• Slider Components
• React Slider Components
• Tailwind CSS Slider Components
• Animated Slider Components

More from Fluid Functionalism

• Slider (Base UI)
• Accordion
• Accordion (Base UI)
• Ask User Questions
• Badge
• Banner
• Breadcrumb
• Button
• Button (Base UI)
• Calendar
• Card
• Carousel Dots