Beui

Overview

beUI is a free, open-source library of animated components for React and Next.js, built with Motion and Tailwind CSS and distributed through the shadcn registry. The site lists 145 React components, and the registry serves the same 145 items. A React Native version, beUI Native, rebuilds 71 components for touch with Reanimated, Gesture Handler and Uniwind.

Components are copy-paste source with composable parts and spring-based motion. Recent additions include a Sankey chart and a draggable timeline. A paid beUI Pro tier for mobile blocks and screens is offered separately; the core libraries are free.

Features

• Motion primitives: Buttons with stateful, magnetic and metallic variants, plus hold-to-confirm and slide-to-confirm actions.
• Overlays: Morphing modal, animated toast stack, bottom sheet, drawer, tooltip and command palette.
• Navigation: macOS-style dock, pill or underline tabs, expandable tabs, expandable action bar and Dynamic Island.
• Inputs: OTP input, range slider, switch, color picker, date range picker, arc picker and adaptive stepper.
• Lists and media: Sortable stack, swipeable list, marquee, tilt card and morphing lightbox.
• Text and numbers: Text and number animations for headlines and counters.
• Charts and timelines: A Sankey chart that morphs with data and a draggable event timeline.

Tech stack

• React, Next.js, Tailwind CSS v4, Motion
• React Native with Reanimated, Gesture Handler and Uniwind (beUI Native)
• clsx, tailwind-merge, lucide-react

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @beui/component-name