Animated componentsfor React and Next.js

A focused conversational surface with visual tones, independent alignment, grouped messages, expandable content, and interactive link or button support.

Composable conversation primitives for message rows, grouped bubbles, avatars, metadata, live markers, and a mount-only trailing-edge pop-up for newly sent rows.

A reader-aware conversation viewport that follows streamed output at the live edge and releases control when the reader moves away.

An auto-growing agent composer with prompt actions, model selection, keyboard submission, and animated send and stop states.

A collapsible agent task plan with morphing status marks, a completion count, compact metadata, and smooth list updates.

A syntax-highlighted code surface with stable streaming updates, line numbers, focused lines, smooth following, and copy feedback.

A human-in-the-loop decision surface for approvals, single or multiple-choice questions, custom responses, and multi-step review flows.

A syntax-highlighted file change disclosure with progressive rows, line numbers, live change counts, smooth following, and completion collapse.

A lightweight execution disclosure for syntax-highlighted terminal output and request responses that collapses into a compact completed state.

A stable response surface with completion actions, rendered content, and an expandable source summary.

A stable generated-image surface that moves from queued work through progressive refinement to a completed result without layout shift.

A human-in-the-loop permission card for reviewing tool details, allowing once, remembering access, or denying execution.

Inline citation markers paired with a collapsible, progressively rendered reference collection for grounded agent responses.

One adaptive activity stream for reasoning, searches, tool calls, structured execution traces, or a chronological mix.

Shimmering reasoning copy with an ASCII loader and cascade, phrase-swap, or per-letter scramble transitions.

A collapsible AI workspace sidebar for folders, projects, files, and bookmarks with keyboard navigation, optimistic moves, inline rename, and overflow-aware labels.

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.

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

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

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

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

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

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

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

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

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

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

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.

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

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

Toggle with a spring-driven thumb and press feedback.

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

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

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

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

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

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

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

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

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.