Animated components
for React and React Native

Copy-paste components for React and Next.js, built with Motion and Tailwind CSS. Now on React Native too. Free, open source, and fully customizable.

Sponsored by

TracwellIllos

Built on Framer Motion. Distributed via shadcn.

$ bunx --bun shadcn add @beui/timeline

New

Recently launched

Line Chart

Line and area charts that morph with your data, with a snapping crosshair and value tooltips.

Bar Chart

Grouped, stacked and horizontal bars that grow in, rescale and reorder with springs.

Sparkline

A compact inline trend for stat cards and tables, with a change badge and optional readout.

Card Dealer

A card table with a face-down deck, a fanned hand and a discard pile. Cards arc across the table between them and flip in flight, hop over each other when the hand is sorted, and lift on hover. Data-driven by each card's zone, with custom faces and backs, keyboard-playable hand cards and reduced-motion support.

beUI Native

Now on React Native

72 components rebuilt for touch with Reanimated, Gesture Handler and Uniwind. The same motion language as beUI, designed for fingers.

$ bunx beui-native add button

Components

Motion primitives

Browse animated React components

Button

Spring-pressed Button plus StatefulButton, MagneticButton, and MetallicButton variants.

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 and optional icons.

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

Composable hover, focus and tap tooltip with a subtle scale and fade, collision-aware side and alignment, an optional arrow, a pointer corridor onto hoverable content, one label at a time, keyboard-only focus reveal and optional cursor tracking.

Text Animation

Animated text primitives for spring reveals, chromatic sweeps, shimmer loading states, letter-cascade swaps and character scrambles.

Number Animation

Animated number primitives for count-up values, rolling tickers, and fixed-slot digit swaps.

Bouncy Accordion

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

Range Slider

Slider with tick dots and a vertical-bar thumb that bounces as it lands on each step. Drag or keyboard, reduced-motion safe.

Theme Toggle

Theme toggle button that repaints the whole page through the View Transition API — a rectangle or circle clip-path reveal, or slats that open across the screen like a shutter.

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

Free and Pro

Choose your starting point

beUI

Free & open source

Build with the essentials.

Animated components you can install, customize, and keep in your codebase.

  • Components, blocks, charts, and AI interfaces
  • Public shadcn registry and copy-paste source
  • MIT licensed for personal and commercial projects
Browse free components

beUI Pro

Go further with Pro

Start with more built for you.

350+ premium blocks to build your next product faster. Get the complete collection with Lifetime, including full templates and animated illustrations.

  • 350+ premium blocks and animated components
  • Full landing-page templates · Lifetime
  • Animated illustrations · Lifetime
  • Agent Skill, MCP access, and one-command installs
  • Private registry and downloadable source
  • Unlimited personal and client projects
  • All future updates · Lifetime
Explore Pro

FAQ

A few things to know

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.