Animated componentsfor React and Next.js

Copy-paste React components built with Motion and Tailwind CSS. Free, open source, and fully customizable.

Built on Framer Motion. Distributed via shadcn.

$ bunx --bun shadcn add @beui/tilt-card

New

Recently launched

Fluid Slider

No thumb. The fill slides behind a rounded liquid cap, and the label flips color wherever the fill covers it.

Attachment Upload

A mixed attachment workspace with a dropzone, staggered file and image rows, animated upload, success, failure, retry and removal feedback, shared-layout image previews, and an audio waveform.

Animated Sidebar

A composable application sidebar with morphing nested navigation that folds into an animated icon rail on desktop and becomes a focus-managed sheet on mobile.

Animated Context Menu

Composable context-menu primitives with a pointer-origin clip morph, a gliding active row, checkbox and radio choices, keyboard navigation, typeahead, and long-press support.

Knockout Wheel

The tournament drawn radially. The champion holds the hub, each round is a ring further out, and the teams themselves form the rim. Nodes spring in ring by ring, and hovering one isolates that team while the rest recede.

Dia Text Animation

A Dia-inspired text effect with a fixed sentence prefix and a cycling final word revealed by a colorful sweep.

Components

Motion primitives

Browse animated React components

Button

Spring-pressed Button plus StatefulButton (idle → loading → success / error) and MagneticButton.

Morphing Modal

Family-app-style modal. A single panel that morphs its height as you navigate between inner views, with blur cross-fade on content.

Animated Toast Stack

Stacked toasts with status morphs, swipe dismissal, actions and layout-aware motion.

Action Swap

CTA button and slot primitives for swapping text and icons with blur motion.

Dock

macOS-style dock with grouped actions and a gliding active pill.

Tabs

Pill, segment or underline tabs with a spring layoutId indicator.

Dynamic Island

iOS-style island pill that morphs between live activity views with bouncy shell resize and blur crossfades.

Command Palette

⌘K palette with fuzzy filter, spring-animated active row and glass surface.

Expandable Action Bar

Compact icon actions that expand into labeled controls on hover or focus with shared layout motion.

Expandable Tabs

Icon tab bar where the active tab expands to a labelled pill, with a panel above that morphs height and slides content direction-aware on switch.

Tilt Card

3D perspective tilt on hover with cursor-tracked glare.

Bottom Sheet

Vaul-inspired draggable bottom sheet with snap points, inertia and glass surface.

Switch

Toggle with a spring-driven thumb and press feedback.

Tooltip

Hover or focus tooltip with blur enter/exit and spring spawn.

Number Animation

Animated number primitives for count-up values and rolling digit tickers.

Bouncy Accordion

Single-open accordion with weighted spring layout, icon rows and reduced-motion-safe content reveals.

Theme Toggle

Theme toggle button with a full-page rectangle clip-path reveal via the View Transition API.

Drawer

Side panel that slides in from the left or right with a spring, backdrop blur, body scroll lock and esc-to-close.

Multi-chain Swap

Cross-chain swap widget with chain + token selectors, morphing views, animated flip and quote.

OTP Input

One-time-code input with a gliding focus ring, digits that roll in per slot, error shake and a success check draw.

Swipeable List

Mobile-style list rows that swipe left or right to reveal contextual action buttons.

Bloom Menu

A button that morphs open into a menu and blooms iris-out from the center, the grid revealing in every direction with radially staggered items.

Testimonials

Loved by builders

Work with me

Need components built for your product?

Custom motion components and frontend systems, built to spec. Book a call or drop a line, whichever's easier.