@easeui
Open-source React components with natural motion, installable as source.
Install this registry
npx shadcn@latest add https://easeui.dev/r/registry.json pnpm dlx shadcn@latest add https://easeui.dev/r/registry.json bunx shadcn@latest add https://easeui.dev/r/registry.json curl -s https://easeui.dev/r/registry.json Components
50 totalExpanding sections that grow to their natural height with no measuring, with arrow key navigation and closed panels skipped by Tab.
npx shadcn@latest add https://easeui.dev/r/accordion.json Banner with a colored accent stripe. Body text stays neutral so contrast never depends on the variant.
npx shadcn@latest add https://easeui.dev/r/alert.json Round avatar whose image fades in on load and crossfades to initials if it fails.
npx shadcn@latest add https://easeui.dev/r/avatar.json Small status pill in five colors, with a crossfade for when its variant changes.
npx shadcn@latest add https://easeui.dev/r/badge.json Button with a quick press, hairline rings instead of borders, four variants, and a 44px tap area even at small sizes.
npx shadcn@latest add https://easeui.dev/r/button.json Bordered surface with header, content, and footer parts for grouping related content.
npx shadcn@latest add https://easeui.dev/r/card.json Checkbox on a real checkbox input, with a check mark that pops in rather than just appearing.
npx shadcn@latest add https://easeui.dev/r/checkbox.json Command-K style search overlay that filters as you type, with arrow keys to move the highlight and Enter to select.
npx shadcn@latest add https://easeui.dev/r/command-palette.json Copies text to the clipboard and trades its icon for a check for a moment, with a label or as a single icon.
npx shadcn@latest add https://easeui.dev/r/copy-button.json A line-by-line diff with an added or removed mark in the gutter and a tinted row for each side. Renders a diff, doesn't compute one.
npx shadcn@latest add https://easeui.dev/r/diff-view.json Sheet that slides up from the bottom edge on the native dialog element. Drag the handle down, or flick it, to dismiss.
npx shadcn@latest add https://easeui.dev/r/drawer.json Action menu that opens from a trigger, flips upward when there is no room below, and supports a destructive item.
npx shadcn@latest add https://easeui.dev/r/dropdown-menu.json A pill that morphs between a compact status line and any number of named live-activity views, the same element reshaping via layout animation each time.
npx shadcn@latest add https://easeui.dev/r/dynamic-island.json A row of icon tabs where the selected one expands to reveal its label, sliding a shared background pill to match.
npx shadcn@latest add https://easeui.dev/r/expandable-tabs.json Dropzone that also opens the native file picker, with a list below it that pops each file in and collapses smoothly on remove.
npx shadcn@latest add https://easeui.dev/r/file-upload.json Text filled with a slowly drifting rainbow. It pauses while off screen and holds still when reduced motion is on.
npx shadcn@latest add https://easeui.dev/r/gradient-text.json Button for destructive actions that fills while you hold it and only fires once the fill completes. Letting go early drains it back quickly.
npx shadcn@latest add https://easeui.dev/r/hold-to-confirm.json Text input whose focus ring grows from a hairline to two px, with a destructive ring for aria-invalid.
npx shadcn@latest add https://easeui.dev/r/input.json A stat tile: a label, a headline value, and an optional trend pill. Pass a Number Ticker as the value to have it roll in on change.
npx shadcn@latest add https://easeui.dev/r/insight-card.json Centered dialog on the native dialog element that fades and scales in, leaves faster than it arrives, and keeps focus inside while open.
npx shadcn@latest add https://easeui.dev/r/modal.json A circular search button that morphs into a text field: the same element grows and reshapes via a layout animation, rather than a new one popping in beside it.
npx shadcn@latest add https://easeui.dev/r/morphing-search.json A deck of notification cards: collapsed to the top card with peeking edges behind it, fanning into a readable list on hover or focus.
npx shadcn@latest add https://easeui.dev/r/notification-stack.json Number that rolls to a new value like an odometer, one changed digit at a time.
npx shadcn@latest add https://easeui.dev/r/number-ticker.json One box per digit for a verification code, with paste and SMS autofill support and a shake for a wrong code.
npx shadcn@latest add https://easeui.dev/r/otp-input.json A panel of arbitrary content anchored to a trigger, opening on click and flipping above it when there's no room below.
npx shadcn@latest add https://easeui.dev/r/popover.json Progress bar that fills with scale instead of width, plus an indeterminate state for unknown durations.
npx shadcn@latest add https://easeui.dev/r/progress.json A pull-down gesture over scrollable content: the indicator tracks the finger 1:1, then resists past the trigger distance and spins while refreshing.
npx shadcn@latest add https://easeui.dev/r/pull-to-refresh.json Native range input with a filled track and tick dots, so keyboard and screen reader support come built in.
npx shadcn@latest add https://easeui.dev/r/range-slider.json Composable select whose menu fades and scales out of the trigger, and opens upward when there is no room below.
npx shadcn@latest add https://easeui.dev/r/select.json A floating bar of bulk actions that fades and rises in once a selection leaves zero, for pairing with Table or any selectable list.
npx shadcn@latest add https://easeui.dev/r/selection-actions.json Loading placeholder with one shimmer shared across the page. Wrap real content and it takes the same shape, then crossfades away.
npx shadcn@latest add https://easeui.dev/r/skeleton.json On and off switch with a quick slide and no bounce. Inside a label, the whole row is the tap target.
npx shadcn@latest add https://easeui.dev/r/switch.json A plain, composable data table: sortable headers with an arrow that only shows on hover until active, and rows that tint when selected.
npx shadcn@latest add https://easeui.dev/r/table.json Pill, segment, or underline tabs with an indicator that slides to the selected tab.
npx shadcn@latest add https://easeui.dev/r/tabs.json One component, three ways to animate text: a scramble that resolves into place, a word or character reveal out of a blur, and a loading shimmer sweep.
npx shadcn@latest add https://easeui.dev/r/text-animation.json Textarea that grows with its content instead of scrolling, down to three rows and up to a scrollable cap.
npx shadcn@latest add https://easeui.dev/r/textarea.json Light and dark switch that reveals the new theme as a circle growing from the center of the screen or from the button itself.
npx shadcn@latest add https://easeui.dev/r/theme-toggle.json Toasts that stay long enough to read based on their word count, and pause while hovered or while the tab is in the background.
npx shadcn@latest add https://easeui.dev/r/toast.json Tooltip that shows a label with its keyboard shortcut, using Command on Mac and Ctrl elsewhere. Moving along a toolbar crossfades to the next tooltip with no d…
npx shadcn@latest add https://easeui.dev/r/tooltip.json Three loading states for AI interfaces: shimmering status text, live agent progress, and cycling reasoning phrases.
npx shadcn@latest add https://easeui.dev/r/agent-loading-states.json A code block with a label, a copy button, and light coloring for keywords, strings, comments and numbers, with no highlighter dependency.
npx shadcn@latest add https://easeui.dev/r/code-block.json A sequence of steps on a dotted canvas, connected by curves that measure the actual cards and follow as you drag one. Click a step to light up its connectors, …
npx shadcn@latest add https://easeui.dev/r/flowchart.json A focused conversational surface with visual tones, independent alignment, and a speech-bubble tail that pops in on arrival.
npx shadcn@latest add https://easeui.dev/r/message-bubble.json A 3x3 grid of cells that twinkle on independent, randomized cycles, paired with a shimmering label and an optional live elapsed timer.
npx shadcn@latest add https://easeui.dev/r/pixel-loader.json A chat composer that grows with its content, submits on Enter, and crossfades its send button into a stop button while a reply streams.
npx shadcn@latest add https://easeui.dev/r/prompt-input.json Wraps a response with the actions people expect once it settles: copy, replay, share, a thumbs up or down, and a list of suggested follow-up prompts. No card o…
npx shadcn@latest add https://easeui.dev/r/streaming-response.json Reveals a model response as it streams in, fading each newly arrived word in on its own without replaying what's already on screen.
npx shadcn@latest add https://easeui.dev/r/streaming-text.json A collapsible agent task plan with morphing status marks and a completion count.
npx shadcn@latest add https://easeui.dev/r/todo-list.json A card for an agent action waiting on approval, with Approve and Deny that collapse into a single status pill once resolved.
npx shadcn@latest add https://easeui.dev/r/tool-approval.json A small pill naming a tool an agent used, with a spinner, check, or error mark that crossfades in place as its status changes.
npx shadcn@latest add https://easeui.dev/r/tool-chip.json