Animated React components, blocks and elements built with Tailwind CSS and Motion. 150+ free, open-source items install with the shadcn CLI; premium components are sold separately.
A long project as one spiral path: progress winds out from the centre, milestones sit along the way, and a second marker shows where the plan says you should be.
A two-sided hero with a shared headline: two full-bleed photos meet at a seam, and the half under the pointer opens up to show its description and button. Stacks on phones.
A two-column sign-in page: a form with passkey and single sign-on, domain detection that offers SSO for company emails, show password, keep me signed in and clear errors, next to a testimonial panel that rotates customer quotes with story-style progress bars, pauses on hover, and highlights the matching company in a logo row.
Resizable panels divided by draggable handles, with min/max size constraints, keyboard resizing, double-click reset, and horizontal or vertical layout.
A hero in a dark room: the pointer carries a soft light that lights up the headline and uncovers notes hidden around it. Left alone, the light wanders by itself.
A global search overlay for an app: one field that searches pages, people, files and actions with fuzzy matching and highlighted letters, scope tabs with live counts that Tab cycles through, grouped results driven by the keyboard, a rich preview of the highlighted result, and recent searches.
A stage-light background shader: five spotlight beams cut through drifting haze from above, swaying slowly, with dust motes glinting only where the light catches them and a warm glow on the floor; the middle spotlight follows the pointer.
A small spreadsheet in a card: lettered columns and numbered rows, click, drag or shift-select ranges, type to edit, a formula bar, a formula engine with SUM, AVERAGE, MIN, MAX and cell maths, colour-coded reference outlines, live sum / average / count, copy-paste and undo.
Keep many alerts out of the way: they stack in a corner as a small deck with a count, open into a list over the page, and clear one at a time or all at once.
A stacked area chart for totals and their parts: smooth layered areas that draw in on scroll, a Total / Share switch for a 100% view, legend toggles that reflow the stack, and a crosshair tooltip with every series and the total.
A stacked A to Z contact list: sticky letter headings that light up as you scroll, an alphabet index on the side that jumps to a letter, search, rows with avatar or initials, tags and last contact, arrow-key navigation, and rows that open to show email and call actions.
A dashboard metric card with an animated count-up value, an auto-derived good/bad trend badge, an optional icon and a drawn-in sparkline.
A metrics section with a concentric ring chart, a trend caption and count-up stats that enter with a blur, slide, fade or scale animation.
A presence and status indicator: online, away, busy, offline and live dots with an optional label, a pulsing ring for live states, and a pinned mode that sits on an avatar's corner behind a cut-out ring.
An accessible step indicator with horizontal and vertical layouts, numbered and minimal variants, animated progress connectors, draw-in checkmarks, an error state and optional clickable steps.
Review an AI agent's plan before it starts: reorder steps, skip the optional ones, watch the time and cost update, then approve and follow it through.
A product page whose buy box hands off to a floating add-to-cart bar once the main button scrolls away: product thumb, live variant summary, an upward size menu, quantity, price and an Add to cart button that turns into Added while the cart count bumps.
A site header that stays out of the way: it slides up while you scroll down and comes back the moment you scroll up, turns compact and frosted after the first few pixels, shows reading progress along its edge, and folds its links into a menu on narrow screens.
Interactive Sticky Notes Wall with light and dark themes.
A complete store header: a dismissible announcement bar, a mega menu with link columns and a featured product per category, an expanding search with trending terms and live product suggestions, wishlist and bag counts, and a slide-in mobile menu with accordion sections.
A streamgraph of how a mix shifts over time: smooth streams flowing around a moving centre line, each swelling and thinning with its share, named inside where they're thick, with hover highlighting and a sorted weekly breakdown.
A big task broken into nested sub-tasks: progress rolls up through every level, blocked work stands out, and groups open and close without moving the card.
A cross-team workflow board with collapsible swimlanes, draggable tasks, accessible status menus, owner filters and a visible work-in-progress limit.
See a multi-bot run on one timeline: each bot in its own lane, who waited on whom, a replay you can scrub, and the critical path that set the finish time.
An event ID badge hanging from a printed lanyard that you can grab and fling: it swings back on real pendulum physics, the strap stretches and settles, the card turns on its clip and the foil strip shimmers as it moves; click to turn it over to a QR code and access zones.
A product grid with Best sellers, New arrivals, On sale and Top rated tabs: each tab sorts the products its own way and shows its own badge and detail line, cards reshuffle into place when you switch, with a hover quick add bar, a wishlist heart and Show more.
An 'On this page' table of contents for articles and docs: it tracks the section in view, slides a marker along its rail (filling it like reading progress), indents subsections, and smooth-scrolls to a heading on click. Collects headings automatically.
An accessible tab set with underline, pill and segmented variants, a sliding animated indicator, icons, counts, arrow-key navigation and animated content panels.
A compact label tag with soft, solid and outline variants, 6 colors, 3 sizes, an optional pulsing dot, icon, count, selectable toggle state and an animated remove button.
A multi-value input that turns text into removable tags on Enter, comma or paste, with suggestions, duplicate and max limits, custom validation and an animated add and remove.
A custom cursor of four corner brackets that roams freely, then snaps around whatever you point at โ links, buttons or anything marked data-lock โ resizing to its exact bounds with a quick focus squeeze and a label tag, like a camera locking on.
Follow a task as it passes between bots and people: who has it now, what each one did, and the note they left for the next.
A workspace members list for settings pages: a seats meter, search, an invite form that turns typed or pasted emails into chips and flags bad ones, role selects that protect the last owner, pending invites with Resend, 2FA badges, last-active status and remove with an inline confirmation.
A physically-simulated cloth intro reveal, drag to tear open a torn-paper layer covering an image, with breakable constraints, particle debris, frayed jagged/rounded edges, and optional surface text or logo. Includes Auto Tear and Reset controls.
A Telegram-style chat bubble widget with a typing simulation, quick replies, a notification popup, availability status, and a launch-in-Telegram send flow.
A macOS-style terminal window that types out a scripted sequence of commands, outputs and comments, with a blinking cursor, auto-scroll and optional looping or manual replay.
A compact trust bar, a star rating with a helped-N-teams label above an infinite, edge-masked logo marquee.
Avatar-and-pill testimonial marquee rows with dual-direction scrolling, a depth effect, cursor spotlight glow, and scroll-in reveal.
A full-bleed photo testimonial slider with crossfade, slide or iris transitions, a thumbnail strip, progress lines, star ratings, and autoplay.
An accessible textarea with outline, filled, and underline variants, label/helper/error text, optional auto-resize and a character counter, and a focus ring, every color, size, and timing exposed as a prop.
Words that flow along a wave, an arc or a circle, looping without a seam and scaling with their container.
Cycling phrases that decrypt from scrambled characters into readable text, left-to-right, right-to-left, or random reveal order, with a scramble-out transition and blinking cursor.
Big outlined lettering with fading echoes stacked beneath it, and a solid fill that follows the pointer through the word.
A light / dark switch that morphs a sun into a moon, or a Light ยท System ยท Dark control with a sliding pill; it remembers the choice, follows the OS in System mode, writes the theme to <html>, and can grow the new theme out of the button in a circle.
A contextual discussion thread with nested replies, reversible reactions, collapsible branches and resolve/reopen controls.
A playable Tic Tac Toe board with a built-in AI opponent, animated piece placement, a drawn winning-line reveal, score tracking, and a confetti burst on a win.
A full-bleed 9:16 TikTok feed mockup with a Following/For You tab bar, a side action rail (like/comment/save/share), caption overlay, sound pill, and bottom navigation.
A photo hero cut into a grid of tiles that flip in a wave to reveal the next picture. Click any tile and the wave starts from there. Autoplay can be paused.