sh4dcnv2 · atlas
← libraries

@beui

Bespoke motion components for React. Copy-paste components with shadcn-compatible installs, Tailwind CSS v4, and Motion.

146 components pro available react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://beui.dev/r/registry.json
pnpm pnpm dlx shadcn@latest add https://beui.dev/r/registry.json
bun bunx shadcn@latest add https://beui.dev/r/registry.json
fetch registry curl -s https://beui.dev/r/registry.json

Components

146 total
Timeline component

A draggable timeline of dated events around a focused card.

npx shadcn@latest add https://beui.dev/r/timeline.json
Animated Alert component

Composable feedback with smooth transitions.

npx shadcn@latest add https://beui.dev/r/alert.json
Animated Collapsible component

Expandable content with a smooth reveal.

npx shadcn@latest add https://beui.dev/r/collapsible.json
Aspect Ratio component

Responsive media with smooth aspect ratio transitions.

npx shadcn@latest add https://beui.dev/r/aspect-ratio.json
Arc Picker component

Radial text picker with top, bottom, left or right curves, smooth wheel movement and live selection on each scroll step. One persistent bracket frame grows and…

npx shadcn@latest add https://beui.dev/r/arc-picker.json
Sortable List component

Composable sortable list with group, item, drag handle, content and undo parts, plus a shared state hook. Spring layout, keyboard reordering, accessible positi…

npx shadcn@latest add https://beui.dev/r/sortable-stack.json
Image Viewer Morphing component

A thumbnail-connected image viewer with composable gallery, thumbnail, content, caption and navigation parts, plus a shared state hook. Expand into the full-si…

npx shadcn@latest add https://beui.dev/r/morphing-lightbox.json
Date Range Picker component

Composable date range picker with root, trigger, popover content, calendar, header, grid, summary, footer, clear and preset parts, plus a shared state hook. Co…

npx shadcn@latest add https://beui.dev/r/date-range-picker.json
Card component

Composable card with header, title, description, action, content and footer parts. Outlined or muted surfaces, standard or compact spacing, and an opt-in selec…

npx shadcn@latest add https://beui.dev/r/card.json
Color Picker component

Composable color picker whose trigger chip morphs into the saturation and brightness area. A loupe lifts off each thumb while you drag. Includes hue and opacit…

npx shadcn@latest add https://beui.dev/r/color-picker.json
Animated Color Selector component

Composable color swatches with a spring-gliding selection ring, press feedback, native radio keyboard navigation, and controlled or uncontrolled state.

npx shadcn@latest add https://beui.dev/r/color-selector.json
Animated Breadcrumb component

Composable breadcrumb navigation with soft path transitions, a hoverable overflow dropdown for long trails, custom separators, and router-link support.

npx shadcn@latest add https://beui.dev/r/breadcrumb.json
Tilt Card component

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

npx shadcn@latest add https://beui.dev/r/tilt-card.json
Button Metallic Button component

A neutral button surface framed by a pronounced chrome rim with a straight traveling reflection.

npx shadcn@latest add https://beui.dev/r/button-metallic.json
Button Button component

Press scale, hover lift, variants and sizes.

npx shadcn@latest add https://beui.dev/r/button-base.json
Button Stateful Button component

Idle → loading → success / error with blur-swap slots and morphing width.

npx shadcn@latest add https://beui.dev/r/button-stateful.json
Button Magnetic Button component

Button composed with the Magnetic wrapper for cursor-attracted pull.

npx shadcn@latest add https://beui.dev/r/button-magnetic.json
Animated CTA Buttons Expanding Arrow Button component

An accent tile that expands into a dotted-arrow trail on hover or focus.

npx shadcn@latest add https://beui.dev/r/expanding-arrow-button.json
Animated CTA Buttons Hold Action Button component

Hold to complete with a vertical or horizontal liquid fill; release early to cancel.

npx shadcn@latest add https://beui.dev/r/hold-action-button.json
Animated CTA Buttons Slide Action Button component

Drag the thumb to the end to confirm an action; release early to spring back.

npx shadcn@latest add https://beui.dev/r/slide-action-button.json
Expandable Control component

Click-to-expand button and chip controls that reveal a label or trailing action through spring layout continuity.

npx shadcn@latest add https://beui.dev/r/expandable-control.json
Adaptive Stepper component

Composable numeric stepper whose fixed footprint adapts at its minimum and maximum while the value rolls between steps.

npx shadcn@latest add https://beui.dev/r/adaptive-stepper.json
Marquee component

Infinite horizontal or vertical scroll with pause-on-hover.

npx shadcn@latest add https://beui.dev/r/marquee.json
Tabs component

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

npx shadcn@latest add https://beui.dev/r/tabs.json
Switch component

Toggle with a spring-driven thumb and press feedback.

npx shadcn@latest add https://beui.dev/r/switch.json
Input component

Text input with label, left/right icons, optional stable error row, error shake and success check draw.

npx shadcn@latest add https://beui.dev/r/input.json
Select Select component

Composable primitives (Select, SelectTrigger, SelectValue, SelectContent, SelectItem); the panel pinches off the trigger and separates, with a short, shared ro…

npx shadcn@latest add https://beui.dev/r/select.json
Select Morph Select component

Composable primitives (MorphSelect, MorphSelectTrigger, MorphSelectValue, MorphSelectContent, MorphSelectItem) where the trigger morphs into the panel via a sh…

npx shadcn@latest add https://beui.dev/r/select-morph.json
Combobox component

Searchable combobox with a morphing portal, grouped filtering, keyboard navigation, and controlled or uncontrolled state.

npx shadcn@latest add https://beui.dev/r/combobox.json
Multi Select component

Composable multi-select primitives with searchable options, removable animated tokens, and a morphing collision-aware panel.

npx shadcn@latest add https://beui.dev/r/multi-select.json
Checkbox component

Form choice control with a draw-on checkmark, spring press feedback and indeterminate state support.

npx shadcn@latest add https://beui.dev/r/checkbox.json
Radio Group component

Single-select choice control with a gliding layoutId indicator dot and spring press feedback.

npx shadcn@latest add https://beui.dev/r/radio.json
Bottom Sheet component

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

npx shadcn@latest add https://beui.dev/r/bottom-sheet.json
Pull to Refresh component

Native-feeling pull-to-refresh container with drag resistance, threshold feedback and async refresh handling.

npx shadcn@latest add https://beui.dev/r/pull-to-refresh.json
Shared Layout Background component

A pill that glides between hovered items via motion's shared layout, with blur enter/exit.

npx shadcn@latest add https://beui.dev/r/shared-layout-bg.json
Bounce Sidebar component

A vertical sidebar whose active dot jumps between destinations on a curved, spring-loaded path.

npx shadcn@latest add https://beui.dev/r/bounce-sidebar.json
Animated Sidebar component

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.

npx shadcn@latest add https://beui.dev/r/animated-sidebar.json
File Tree component

Composable file and folder primitives with springing branches, a gliding selection, and complete keyboard navigation.

npx shadcn@latest add https://beui.dev/r/file-tree.json
Preview Rail component

Codex app-inspired navigation rail with compact ticks that form a hover pyramid and reveal a floating destination preview.

npx shadcn@latest add https://beui.dev/r/preview-rail.json
Dock component

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

npx shadcn@latest add https://beui.dev/r/dock.json
Tooltip component

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 …

npx shadcn@latest add https://beui.dev/r/tooltip.json
Animated Context Menu component

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

npx shadcn@latest add https://beui.dev/r/context-menu.json
Popover Gooey Popover component

Composable Popover, PopoverTrigger, PopoverContent; the panel oozes out of the trigger through an SVG goo filter with a liquid neck, crisp content fading in on…

npx shadcn@latest add https://beui.dev/r/popover.json
Popover Morph Popover component

Composable MorphPopover, MorphPopoverTrigger, MorphPopoverContent. The full-size panel reveals from the corner nearest the trigger on one synchronized spring c…

npx shadcn@latest add https://beui.dev/r/popover-morph.json
Morphing Modal component

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

npx shadcn@latest add https://beui.dev/r/morphing-modal.json
Center Morph Modal component

A composable modal whose full-size surface unfolds from its exact center toward every edge, then folds back the same way with an inset close control.

npx shadcn@latest add https://beui.dev/r/center-morph-modal.json
Text Animation Text Scramble component

A controlled character scramble that resolves changed text while keeping its final value accessible.

npx shadcn@latest add https://beui.dev/r/text-scramble.json
Text Animation Dia Text Animation component

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

npx shadcn@latest add https://beui.dev/r/chromatic-text-reveal.json
Text Animation Text Reveal component

Word or character reveal with spring slide-up and blur.

npx shadcn@latest add https://beui.dev/r/text-reveal.json
Text Animation Text Shimmer component

Gradient sweep across text for loading or emphasis.

npx shadcn@latest add https://beui.dev/r/text-shimmer.json
Text Animation Text Cascade component

Letter-by-letter slot roll for standalone text — old letters drop away as new ones land, left to right.

npx shadcn@latest add https://beui.dev/r/text-cascade.json
Number Animation Digit Swap component

Fixed-slot digits and mask glyphs that roll on change with controllable direction, stagger, replay, and suffix emphasis.

npx shadcn@latest add https://beui.dev/r/digit-swap.json
Number Animation Number Ticker component

Slot-machine rolling digits with staggered entry.

npx shadcn@latest add https://beui.dev/r/number-ticker.json
Number Animation Animated Number component

Spring-driven count-up triggered when in view.

npx shadcn@latest add https://beui.dev/r/animated-number.json
Animated Badge component

Status badge with animated state icons, pulse feedback and compact size variants.

npx shadcn@latest add https://beui.dev/r/animated-badge.json
Action Swap Cascade component

Letter-by-letter slot roll — the old label's letters drop away as the new ones land, left to right.

npx shadcn@latest add https://beui.dev/r/action-swap-cascade.json
Action Swap Blur component

Copy-button style swap with blur, opacity and scale.

npx shadcn@latest add https://beui.dev/r/action-swap-blur.json
Action Swap Roll component

The next text or icon rolls in from below with blur.

npx shadcn@latest add https://beui.dev/r/action-swap-roll.json
Animated Toast Stack component

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

npx shadcn@latest add https://beui.dev/r/animated-toast-stack.json
Theme Toggle component

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…

npx shadcn@latest add https://beui.dev/r/theme-toggle.json
Bouncy Accordion component

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

npx shadcn@latest add https://beui.dev/r/bouncy-accordion.json
Drawer component

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

npx shadcn@latest add https://beui.dev/r/drawer.json
Scroll Animation Smooth Scroll component

Smooth-scroll provider over Lenis with a useSmoothScroll hook exposing scroll offset, progress and velocity. Reduced-motion safe.

npx shadcn@latest add https://beui.dev/r/smooth-scroll.json
Scroll Animation Scroll Progress component

Reading-progress indicator — fixed bar or circular ring — driven by scroll position via useSmoothScroll, with spring smoothing.

npx shadcn@latest add https://beui.dev/r/scroll-progress.json
Scroll Animation Parallax component

Wrapper that drifts its children at a speed factor as they cross the viewport, on either axis. Reduced-motion safe.

npx shadcn@latest add https://beui.dev/r/parallax.json
Scroll Animation Scroll To component

Button that smooth-scrolls to a target (offset, selector or element) via the active SmoothScroll provider; reduced-motion jumps instantly.

npx shadcn@latest add https://beui.dev/r/scroll-to.json
Scroll Animation Scroll Reveal component

Reveals its children with a spring slide and blur as they enter the viewport, once or every time. Reduced-motion keeps a fade.

npx shadcn@latest add https://beui.dev/r/scroll-reveal.json
Range Slider Inline Slider component

An inset fill and inline label and value. Ten evenly spaced stops span the track; markers under text stay hidden but remain interactive, and the thumb parts ar…

npx shadcn@latest add https://beui.dev/r/range-slider-inline.json
Range Slider Range Slider component

Tick dots, and a vertical-bar thumb that bounces as it lands on each step.

npx shadcn@latest add https://beui.dev/r/range-slider.json
Range Slider Fluid Slider component

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

npx shadcn@latest add https://beui.dev/r/range-slider-fluid.json
Range Slider Wave Slider component

Equalizer bars peak around the handle and drop back once it passes, so the value moves down the track as a wave.

npx shadcn@latest add https://beui.dev/r/range-slider-wave.json
Range Slider Bubble Slider component

Grab the thumb and a value bubble pops out of it. The bubble tilts and squashes with how fast you drag, then settles upright.

npx shadcn@latest add https://beui.dev/r/range-slider-bubble.json
Range Slider Ruler Slider component

The needle stays put and the scale scrolls under it. A flick keeps going and settles on the nearest tick. Fractional steps read at the step's own precision.

npx shadcn@latest add https://beui.dev/r/range-slider-ruler.json
Wheel Picker component

iOS-style picker wheel: a 3D drum on native momentum scroll that snaps to the nearest notch, with wheel, drag and keyboard control. Composes side by side for d…

npx shadcn@latest add https://beui.dev/r/wheel-picker.json
Table Data Table component

10k virtualized rows with sortable headers, row selection, column resize and reorder.

npx shadcn@latest add https://beui.dev/r/table.json
Table Editable Table component

Edit cells inline and insert or delete rows and columns via border handles; the table re-renders from the updated data and column defs.

npx shadcn@latest add https://beui.dev/r/table-editable.json
Table Async Table component

Loads pages on demand — skeleton rows on first load, then infinite scroll via onEndReached as the virtualized list nears the bottom.

npx shadcn@latest add https://beui.dev/r/table-async.json
Shader Background component

Canvas shader backgrounds (mesh gradient, grain, warp, waves, voronoi, dot orbit and more) with a single typed variant prop. Reduced-motion freezes animated va…

npx shadcn@latest add https://beui.dev/r/shader-background.json
Cylinder Carousel component

A carousel whose items line the inside of a cylinder, receding into the center and growing toward the edges. Drag, scroll or arrow-key to roll it, with a sprin…

npx shadcn@latest add https://beui.dev/r/cylinder-carousel.json
Loader component

Loading indicator with seventeen variants: spinner, dots, bars, dot-matrix, dither, morph, comet, scramble, metaballs, newton, helix, percent, and five termina…

npx shadcn@latest add https://beui.dev/r/loader.json
Sankey Chart component

Weighted flows between stages that draw in and morph with your data.

npx shadcn@latest add https://beui.dev/r/sankey-chart.json
Treemap component

Proportional tiles that morph with your data, with value and share tooltips.

npx shadcn@latest add https://beui.dev/r/treemap.json
Candlestick Chart component

Live OHLC candles with volume, a last-price line, and a crosshair readout.

npx shadcn@latest add https://beui.dev/r/candlestick-chart.json
Donut Chart component

Rounded share segments with a linked center readout and legend.

npx shadcn@latest add https://beui.dev/r/donut-chart.json
Volume Profile component

Animated volume by price, with point of control and value area highlights.

npx shadcn@latest add https://beui.dev/r/volume-profile.json
Status Bar component

Animated status history with rounded bars and period tooltips.

npx shadcn@latest add https://beui.dev/r/status-bar.json
Composition Chart component

Stacked bar and area shares with period tooltips and a compact interactive legend.

npx shadcn@latest add https://beui.dev/r/composition-chart.json
Funnel Chart component

Vertical and horizontal funnels with curved stages and animated number tooltips.

npx shadcn@latest add https://beui.dev/r/funnel-chart.json
Liquidity Heatmap component

Animated liquidity bands across price and time, with a price trace and depth tooltips.

npx shadcn@latest add https://beui.dev/r/liquidity-heatmap.json
Bump Chart component

Animated rankings with curved paths, interactive rank dots, and tooltips.

npx shadcn@latest add https://beui.dev/r/bump-chart.json
Order Book component

Animated order book with bid and ask depth, spread, and volume balance.

npx shadcn@latest add https://beui.dev/r/order-book.json
Heat Calendar component

Composable activity calendar with Grid, Legend, and Tooltip parts, controlled range selection, and UTC calendar dates. Supply weekly intensities to visualize a…

npx shadcn@latest add https://beui.dev/r/heat-calendar.json
Returns Calendar component

Composable monthly returns calendar with Grid and Tooltip parts, controlled month or year selections, and compounded totals. Supply your own years and monthly …

npx shadcn@latest add https://beui.dev/r/returns-calendar.json
Price Target Fan component

Composable price target chart with Header, Plot, SVG, Axes, History, Targets, Now, Cursor, and Tooltip parts. Supply dated price history and targets; scrub wit…

npx shadcn@latest add https://beui.dev/r/price-target-fan.json
Voice Orb component

Breathing liquid voice visualization with flowing highlights, custom pigments and a soft, voice-reactive silhouette. Accepts a normalized level, MotionValue or…

npx shadcn@latest add https://beui.dev/r/voice-orb.json
Message Bubble component

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

npx shadcn@latest add https://beui.dev/r/message-bubble.json
Message component

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

npx shadcn@latest add https://beui.dev/r/message.json
Message Scroller component

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

npx shadcn@latest add https://beui.dev/r/message-scroller.json
Prompt Input component

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

npx shadcn@latest add https://beui.dev/r/prompt-input.json
Todo List component

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

npx shadcn@latest add https://beui.dev/r/todo-list.json
Code Block component

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

npx shadcn@latest add https://beui.dev/r/code-block.json
Approval Card component

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

npx shadcn@latest add https://beui.dev/r/approval-card.json
File Diff component

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

npx shadcn@latest add https://beui.dev/r/file-diff.json
Tool Result component

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

npx shadcn@latest add https://beui.dev/r/tool-result.json
Streaming Response component

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

npx shadcn@latest add https://beui.dev/r/streaming-response.json
Image Generation component

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

npx shadcn@latest add https://beui.dev/r/image-generation.json
Tool Approval component

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

npx shadcn@latest add https://beui.dev/r/tool-approval.json
Citations component

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

npx shadcn@latest add https://beui.dev/r/citations.json
Agent Activity component

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

npx shadcn@latest add https://beui.dev/r/agent-activity.json
Agent Loading States Reasoning Text component

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

npx shadcn@latest add https://beui.dev/r/reasoning-text.json
Agent Loading States Thinking Shimmer component

A quiet shimmer that keeps the agent's current status readable while work continues.

npx shadcn@latest add https://beui.dev/r/thinking-shimmer.json
Agent Loading States Agent Progress component

A compact activity glyph, action verb, and live tabular timer for longer-running agent work.

npx shadcn@latest add https://beui.dev/r/agent-progress.json
AI Sidebar component

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

npx shadcn@latest add https://beui.dev/r/ai-sidebar.json
Chat App component

A complete agent conversation workspace composing navigation, messages, streaming, planning, approvals, tools, code, diffs, generated media, sources, and promp…

npx shadcn@latest add https://beui.dev/r/chat-app.json
Infinite Masonry block

Responsive virtualized masonry that measures variable-height cards and loads more data as the user nears the end.

npx shadcn@latest add https://beui.dev/r/infinite-masonry.json
Notification Stack block

Compact notification cards that spring from a stacked summary into a readable list on hover, focus or tap.

npx shadcn@latest add https://beui.dev/r/notification-stack.json
Project Folder block

An interactive project folder that opens its file fan on hover or focus, expands into a focus-managed overlay, then retraces the complete path when closed.

npx shadcn@latest add https://beui.dev/r/project-folder.json
Card Folder block

A landscape card tucked into a stitched purse pocket that lifts forward as the purse compresses into its bottom seam, with controlled open and card-detail visi…

npx shadcn@latest add https://beui.dev/r/card-folder.json
Fixtures Knockout Wheel block

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 rin…

npx shadcn@latest add https://beui.dev/r/knockout-wheel.json
Fixtures Knockout Bracket block

Pages one round at a time. The leftmost round stacks at a fixed rhythm, each later round centers between its two feeder matches, and cards, elbow connectors, h…

npx shadcn@latest add https://beui.dev/r/knockout-bracket.json
Availability Scheduler block

Weekly availability editor where each day springs between available and unavailable, time ranges add and remove with blur-slide motion, times pick from a scrol…

npx shadcn@latest add https://beui.dev/r/availability-scheduler.json
Multi-chain Swap block

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

npx shadcn@latest add https://beui.dev/r/swap.json
Dynamic Island block

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

npx shadcn@latest add https://beui.dev/r/dynamic-island.json
Command Palette block

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

npx shadcn@latest add https://beui.dev/r/command-palette.json
Morphing Search Chip Search block

Docked search bar that springs wider on focus and unfolds a recent-searches panel out of its own edge. Terms become removable chips, the bar grows with them, a…

npx shadcn@latest add https://beui.dev/r/morphing-search-chips.json
Morphing Search Morphing Search block

Search field or compact icon that morphs into a glass results surface, whether opened by click or keyboard shortcut.

npx shadcn@latest add https://beui.dev/r/morphing-search.json
Expandable Action Bar block

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

npx shadcn@latest add https://beui.dev/r/expandable-action-bar.json
Overflow Actions block

Connected pill rail for primary actions that springs open to reveal extra controls.

npx shadcn@latest add https://beui.dev/r/overflow-actions.json
Expandable Tabs block

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.

npx shadcn@latest add https://beui.dev/r/expandable-tabs.json
Morphing Tabs block

Reorderable tabs whose selected item grows into a white content surface, with the active shape gliding as tabs move and a shared morph between rooms.

npx shadcn@latest add https://beui.dev/r/morphing-tabs.json
Swipeable List block

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

npx shadcn@latest add https://beui.dev/r/swipeable-list.json
File Upload Attachment Upload block

A mixed attachment workspace with a dropzone, staggered file and image rows, animated upload, success, failure, retry and removal feedback, shared-layout image…

npx shadcn@latest add https://beui.dev/r/attachment-upload.json
File Upload Upload Queue block

A drag-and-drop upload queue with progress rows, upload states, retry, and removal.

npx shadcn@latest add https://beui.dev/r/file-upload.json
Prediction Market Market Cards block

Compact market listings with consistent outcome rows, animated odds CTAs, payout multipliers and bookmarks. Odds CTAs use green/red backgrounds and roll into Y…

npx shadcn@latest add https://beui.dev/r/prediction-market-card.json
Prediction Market Trade Ticket block

Buy and sell outcomes with rolling amount entry, quick add chips and trade states.

npx shadcn@latest add https://beui.dev/r/prediction-market.json
Wallet Card block

Wallet overview card with an account switcher and search that morph open from their triggers, a cascading balance with a live change pill and privacy toggle, c…

npx shadcn@latest add https://beui.dev/r/wallet-card.json
OTP Input block

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

npx shadcn@latest add https://beui.dev/r/otp-input.json
Sign Up Form block

Composed sign-up form that flags a field only once it is left, then clears the moment it is fixed, with a length-weighted strength meter, password reveal and a…

npx shadcn@latest add https://beui.dev/r/signup-form.json
Card Dealer block

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 …

npx shadcn@latest add https://beui.dev/r/card-dealer.json
Bloom Menu block

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.

npx shadcn@latest add https://beui.dev/r/bloom-menu.json
Feedback Widget block

Corner trigger that morphs open into a feedback popup with message entry and animated sending, success and retry states.

npx shadcn@latest add https://beui.dev/r/feedback-widget.json
404 / Not Found Glitch block

Digits scramble through random glyphs before resolving, with a chromatic split on hover.

npx shadcn@latest add https://beui.dev/r/not-found-glitch.json
404 / Not Found Magnetic block

Each digit is cursor-attracted via the Magnetic wrapper and springs back on leave.

npx shadcn@latest add https://beui.dev/r/not-found-magnetic.json
404 / Not Found Spotlight block

A dark panel where a cursor-tracked spotlight reveals the bright code from a dim base.

npx shadcn@latest add https://beui.dev/r/not-found-spotlight.json
404 / Not Found Stacked block

A code card over a hidden stack that fans out with a spring on hover.

npx shadcn@latest add https://beui.dev/r/not-found-stacked.json
404 / Not Found Terminal block

A terminal window that types a failed cd command and a 404 status, with a blinking caret.

npx shadcn@latest add https://beui.dev/r/not-found-terminal.json