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 number that rolls like a car odometer: each digit turns on its own column with a small delay, and separators and currency come from the locale.
A floating setup guide for the corner of an app: a progress ring that shrinks into a pill showing the next step, steps grouped into sections with their own counts, one step open at a time with its time estimate and action button, Skip for now, a reward for finishing, confetti, and dismiss with a way back.
A careers board: search, department chips with live counts, remote, hybrid and on-site toggles, roles grouped by department in expandable rows with summary, highlights, pay and an apply link, New badges for fresh roles, and a get-notified form.
One screen for running a fleet of AI bots: live totals, a traffic chart, alerts to clear, what every bot is doing, and a guarded switch to pause them all.
A border that a beam of light runs around: a bright conic streak orbits the edge of any card, button or badge, a soft halo of the same light spills outside it, and the beam picks up speed smoothly while you hover.
Goals as concentric orbits: each ring closes as its target is met, a small satellite circles every track, and pointing at a ring brings its number to the centre.
A checkout order bump: the main item plus one-time add-on offers in dashed boxes with a pulsing arrow and a passing shine, a checkbox that draws its check, discounted prices, option pills that unfold once added, summary lines that fold in, a counting total and a savings note.
A thank-you section after checkout: springy check with confetti, a copyable order number, a tracking timeline with the current step pulsing, a live change-or-cancel window with an inline confirm, downloadable receipt and calendar file, items with buy again, address and payment, create-an-account and a copyable referral code.
An account orders page: status tabs with counts, search by order number or product, order cards with stacked thumbnails and colored status pills (a pulsing dot for orders on the way), expandable details with a delivery progress timeline, tracking number, line items and actions to track, buy again, return, cancel or download the invoice.
An editable order summary card: line items with thumbnails, quantity steppers, struck-through original prices and remove with undo, 'show more' for long orders, a gift-wrap option with a note, a delivery estimate worked out in business days, collapsible price details, a counting total and a savings callout.
An org chart of people cards joined by rounded connector lines: teams open and close from a count chip under each manager, and picking someone lights up their reporting line all the way to the top.
A complete two-step verification screen: text, authenticator or email codes, six boxes with auto-advance, paste and auto-submit, a shake and attempts left on a wrong code, a timed lockout, a resend cooldown, an authenticator refresh ring, recovery codes, trust this device, and a success state.
A page heading in three variants (simple, with meta details, with a cover and avatar): breadcrumb, a title you can rename in place, a Draft or Published status, Copy link that confirms, Preview, a Publish button that flips its label, and a More menu that holds actions on narrow screens.
An accessible pagination control with smart ellipsis ranges, a sliding animated active page, solid, soft and compact variants, previous/next buttons and optional labels.
A surface container with an optional header (icon, title, description, actions), body and footer, with outline, filled and elevated variants and an animated collapse.
A heading folded like a concertina of paper. It opens as it comes into view, and folds back up while the pointer is over it.
A drawn mountain range in depth layers that follow the pointer, with the headline set between the ridges so the near peaks pass in front of it. Takes your own artwork too.
A section of floating photos and type that drift at different speeds as it scrolls past, so the layers separate into depth, and lean slightly toward the pointer; works with page scrolling and scroll containers alike.
A password field with an animated show/hide eye toggle, a four-segment strength meter, a live requirements checklist and a Caps Lock warning.
A create-password screen that explains strength instead of just scoring it: entropy in bits and an estimated time to crack, a five-step meter, live checks for length, variety, runs, keyboard patterns, your name or email and leaked passwords, a tip for the first problem, a passphrase generator, copy and show, and saving only once it's strong.
A pay button that shows every step of a payment: the amount, a spinner while it processes, a drawn tick when it's paid, a shake and a clear message when a card is declined, and an optional press-and-hold mode that fills up before it charges.
See a month of money going out: every due date with its amount, heavier days shaded darker, what's overdue, and pay from the same screen.
A payroll run review screen: status steps from draft to scheduled, counting totals for gross, net, taxes and deductions with a split bar and change vs last month, departments that expand to employees with prorations and commissions flagged, pre-run checks you resolve in place, and an approve → confirm → processing → scheduled flow.
A sticker you can actually peel: grab a corner and it lifts along a fold that follows your pointer, showing the paper backing in the sticker's own shape with a soft shadow; let go and it settles back, or pull far enough and it comes off and sticks itself back on.
A stack of small decisions waiting on you: answer the top card with a click or a number key, skip it for later, and undo the last one if you change your mind.
A work queue you can steer: drag jobs into a new order, see when each one will really start, cancel with undo, and pause the queue with one click.
An HR people directory: search, status tabs with counts, a department filter, sortable name / team / location / start date columns, status pills, row and page selection with a bulk action bar for message and CSV export, pagination, and a card list on narrow screens.
A radar chart that blooms: each score is a petal, a dashed outline shows the benchmark, and petals ease to their new size as you switch between teams.
An app launch hero: five phones open out from a stack into a fan, and the one you point at rises while its neighbours step aside. Comes with drawn screens, or use screenshots.
A phone number input with a searchable country menu: flags and calling codes, as-you-type formatting per country, paste detection for +codes, an E.164 value and a length check.
A realistic iPhone frame with 3D cursor tilt, a screen glare that tracks the tilt, ambient glow, and a story-style video/image player with swipe navigation and a progress bar.
A bound photo album with a linen cover that opens and pages that turn in 3D: drag or tap to turn, the page lifts when you near its edge, line indicators jump between spreads, and a captioned lightbox opens on any photo.
A customer photo wall for a product: a mosaic with a featured photo and quote, All / 5 stars / Verified filters, a +N tile, a lightbox with the photo, rating, review, verified badge, helpful vote, thumbnails, arrow keys and swipe, plus an Add your photos button that previews picked images.
An area where moving the pointer deals out photos along its path: each one pops in turned the way you were travelling, holds for a moment on top of the last, then sinks and fades, cycling through your set.
A donut-style pie chart with a live center total, click-to-toggle legend, percentage callouts around the ring, and a hover tooltip with ARR, account count, and average contract size.
A photo card that breaks into a chunky pixel mosaic on hover and resolves into a second photo, or comes into focus from pixels, drawn on a canvas in stepped block sizes with a live pixel-size readout, touch and keyboard support and a reduced-motion crossfade.
A slideshow that changes images block by block: the frame breaks into a grid, each block flashes to the new picture's colour and then resolves into it, in a random scatter, a diagonal sweep or a ripple from the centre, with dots, arrows and autoplay.
A glowing plasma cloud shader that folds in on itself like coloured smoke, built from layered domain-warped noise; the pointer stirs a slow swirl into it, and anything you place inside sits on top.
A canvas Pong against a bot opponent, three difficulty levels, multi-round progression with a color shift and speed increase each round, keyboard and touch-drag paddle control.
A round button circled by slowly turning text that pops its links out along an arc: a hairline ring opens behind them, icons spring out in a stagger with labels sliding outward, from a corner, an edge or in a full circle.
An accessible popover for interactive content with click or hover triggers, 4 placements and 3 alignments, auto-flip, outside-click and Escape close, an arrow and a spring open animation.
A portfolio grid with wide and tall tiles packed densely, a sliding category filter that reflows the grid, hover reveals with client and year, and a lightbox with details, next and previous, keyboard arrows and Escape.
An endless tunnel lined with posters you fly through: hairline frames rush past, the far end dissolves into fog, scroll or drag to speed up or reverse, hover to slow down, and line indicators fly you to any poster.
An in-app upgrade card shown near a plan limit: a rotating gradient border, a segmented usage meter, what Pro unlocks, a monthly / yearly switch with an animated per-seat price and savings, a seat stepper with the total, a free-trial button with loading and welcome states, and Maybe later that collapses it into a slim banner.
A printed-menu style price list for cafés, salons and studios: section tabs with a sliding pill, dotted leaders to each price, sizes side by side, favourites and diet filters.
A per-seat pricing section: a team size slider, monthly or yearly billing and a currency picker that recalculate every card's seat price and monthly total as they count, plans that grey out when the team is too big, and a compare all features table that opens below.
A looping plan carousel with one card in the spotlight: neighbours recede and blur, the active card glows in its own colour with a light that follows the pointer, and you can swipe, click or use the arrow keys.
Pricing plans side by side with a monthly / yearly switch, prices that roll when the period changes, a highlighted plan with a badge, included and excluded features, and a custom-price plan for enterprise.