Refined UI components with satisfying hover. Built on shadcn/ui and Radix primitives — every transition exists to make a state change legible.
Live docs & demos | Browse components
Add the registry to your project:
npx shadcn@latest registry add @fluidThen install any component:
npx shadcn@latest add @fluid/buttonOr install directly without adding the registry:
npx shadcn@latest add https://www.fluidfunctionalism.com/r/button.jsonDependencies resolve automatically. Font weight animations require the Inter variable font.
| Component | Description |
|---|---|
| Accordion | Collapsible sections with animated expand/collapse and proximity hover |
| Badge | Compact label with solid and dot variants, Tailwind color palette |
| Button | Variants, sizes, loading state, and icon support |
| CheckboxGroup | Merged backgrounds for contiguous selections |
| Dialog | Modal with smooth enter/exit animations and overlay |
| Dropdown | Menu-style dropdown with proximity hover |
| InputCopy | Read-only input with copy-to-clipboard and animated feedback |
| InputGroup | Input fields with proximity hover and validation |
| RadioGroup | Radio buttons with proximity hover and animated selection |
| Select | Animated select with bordered/borderless variants |
| Slider | Range slider with step snapping, range mode, animated thumb |
| Switch | Toggle with animated thumb and label |
| Table | Data table with row hover effects |
| Tabs | Segmented control with sliding indicator and proximity hover |
| TabsSubtle | Tab navigation with smooth pill animations |
| ThinkingIndicator | Animated status indicator with morphing SVG |
| ThinkingSteps | Chain-of-thought display with sequential animation |
| Tooltip | Spring-based floating tooltip with configurable placement |
- Motion as information — transitions make state changes legible, nothing moves for decoration
- Hover as preview — proximity highlights show where your action will land before you click
- Spring physics — springs replace fixed durations, adapting naturally to interruption
- Drop-in compatible — your existing shadcn theme and tokens apply automatically
- Next.js 15 + React 19
- Tailwind CSS v4
- Framer Motion
- Radix UI primitives
- shadcn/ui registry protocol
MIT