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 week of hours as a barcode: one thin line per hour, brighter when busier. A lens opens under the pointer, and the lines can rise into a regular bar chart.
A plain, dependable carousel: drag or swipe between slides, arrows and dots, one to four slides in view, looping, and optional autoplay whose progress fills the active dot and pauses whenever someone hovers, focuses or drags.
A clean, semantic table for showing data as it is: plain, striped or bordered, comfortable or compact, a caption and a totals row, custom cells such as status pills, a sticky header that casts a shadow once you scroll, and rows that fade in on load.
See a big batch at a glance: one square per job, coloured by status, with pills to pick out failures and a single button to retry them.
A bento layout of feature cells that span columns and rows, fall back to two and then one column as the container narrows, fade in one after another, and light up under the pointer, with a demo set of small live visuals.
A hero built as a hairline bento grid: the headline shares the first screen with live cells, from counting totals and a period switch to uptime bars and rotating activity.
A subscription billing card: plan and renewal date, a monthly or annual switch with the yearly saving, a seat stepper that cannot drop below seats in use, usage meters that warn near their limits, a live next-invoice breakdown with VAT, saved payment cards, and a two-step cancel with undo.
A quote with its author: a rule on the left, a large quotation mark, a framed card or a big centred pull quote, revealed as it scrolls into view with a highlighter sweeping across the phrase that matters.
A blog section with a featured post card, category tabs with a sliding pill, an editorial list of posts where a thumbnail follows the cursor over each row, and a Show more button that reveals posts in pages.
A booking form in one card: service cards, a month calendar with closed days and keyboard navigation, time slots built from your opening hours with booked ones struck out, a guest counter, contact fields, a live summary and a confirmation screen.
One inbox for everything your bots say to you: questions that need an answer, one-tap replies, and updates you can read and move on from.
Every AI bot on one screen: what each is doing, how reliable it's been, what it's spent today, and one click to pause, start or unblock it.
A gallery of ready-made AI bots: search and filter by team, open one to see what it does and connects to, and add it to your workspace.
A mobile bottom sheet that slides up over a dimmed backdrop, rests at snap points you drag between from its handle, closes on a downward flick, and keeps its own content scrollable.
A squared-up deck of photo cards that springs open into a fan on hover with a bouncy, centre-out stagger; the card under the pointer rises and nudges its neighbours aside, a click pops one up as the pick, and it opens with a tap on touch screens.
A rule map you can walk: pick any step to light the path to it, see what share of cases goes each way, and read the outcome. On phones it asks one question at a time.
A theme editor for a product's brand: primary and accent colors with a picker, hex field and presets, an 11-step scale generated from the primary, a live contrast check for text on the brand color, a corner radius slider, and a light and dark preview of real UI that updates as you edit. Copy the CSS variables or save the theme.
An accessible breadcrumb trail with 4 separator styles, an optional home icon, animated collapse of long paths behind an expandable ellipsis, and hover tint.
A realistic browser chrome frame in macOS, Windows, or mobile Safari style, with tabs, a URL bar, and a content area for an image, video, or arbitrary React children.
A bubble chart for three measures at once: x, y and bubble size, coloured by group, split into four labelled quadrants like a portfolio matrix, with bubbles that pop in largest first, names inside the big ones and a tooltip that says which quadrant an item sits in.
A liquid-glass bubble that follows the pointer across the whole page, rendered with a raymarched WebGL2 metaball trail with fresnel shading and iridescent glints, plus an optional light/dark theme toggle.
A bullet chart for goals: one compact row per KPI with poor / fair / good bands, the actual value as a bar, a target line, last quarter's marker and an on-track / at-risk / behind status, including metrics where lower is better.
A header whose round burger folds into a cross (or a back arrow) and drops a soft panel of numbered serif links, with a gliding highlight, a second level that slides in, keyboard arrows and a footer CTA.
A premium opening-hours card, live open/closed status with a pulsing dot, a day-by-day schedule, and a Get Directions link built from an address or custom URL.
An accessible button with primary, secondary, outline, and ghost variants, a spinning loading state, optional icon, and a focus ring, every color, size, and timing exposed as a prop.
Buttons joined into one control: plain action groups like Previous / Today / Next, a single-choice group whose fill slides between options, multi-toggle groups, and a split button whose chevron opens a menu of alternative actions.
An inline month calendar for picking one day, a range or several days, with event dots under their days, an agenda for the selected day, months that slide in from the side they come from, a month picker, week numbers and full keyboard control.
A year of activity in twelve dot calendars, with intensity levels, day-by-day replay, hover ripples and full keyboard navigation.
An inline message block with info, success, warning, danger and neutral variants, three appearances, self-drawing icons, an optional action link and an animated dismiss.
A marketing campaign dashboard: channel filter and 7d / 30d / 90d range, six KPI tiles with change vs the previous period (four of them switch the chart), a daily line chart against a dashed previous period with crosshair tooltips, and a campaign list with budget pacing, ROAS, cost per conversion, sorting and pause / resume switches.
A trading-style candlestick chart: OHLC candles with a volume panel, a moving average, 1M / 3M / 6M range tabs, a last-price marker, and a crosshair with price and date pills plus a live OHLC readout.
One grid for what every AI bot can reach: click a cell to set no access, read or change, see risky permissions flagged, and save only what you edited.
A flexible content card with media, badge, title, description, action and footer slots, default, elevated, outline and filled variants, vertical or horizontal layout, and interactive hover lift with an optional cursor spotlight.
Three working card headings: a person heading with avatar, time, a Follow button and a ⋯ menu (pin, copy link, hide with undo), a title and description heading with a period menu that redraws a chart, and a settings heading with a switch and a collapse toggle.
A loose pile of photo cards you shuffle through: throw the top card aside and it tucks in under the stack, bring the bottom one back on top, with drag and flick physics, buttons, arrow keys, optional autoplay and a reduced-motion fallback.
A banking card manager: card tabs, a 3D card that flips to reveal the number, expiry and CVC (and hides itself again), copy number, a frosted freeze state, monthly spend against an adjustable limit, per-card controls for online, contactless, ATM and abroad, recent payments, and creating a new virtual card.
A product with a size picker whose Add to cart opens a centered cart modal: an Added to your cart header, line items with quantity steppers, complete-the-set add-ons, a discount code field, totals and checkout, with focus trap, Escape and click-outside to close.
An add-to-cart modal with a mix-and-match deal: it confirms the item, shows how many more to add for the next discount tier on a progress track, lets shoppers add picks right in the modal with prices already discounted, and counts the savings and total as tiers unlock.
A shop-by-category row of round photo bubbles that scrolls, drags and snaps, with arrows, a scroll progress bar, New badges and a Sale bubble; picking a category slides a ring onto it and swaps in that category's products with quick add buttons.
A bento grid of shop categories: one large feature tile, wide and small tiles with product photos on a light surface, product counts and starting prices, badges like 'New season' or 'Up to 40% off', subcategory chips, hover zoom and a rotating arrow, plus an 'All products' link.
A change-password card for account settings: current password with a forgot link, a new password with a four-step strength meter, a live requirements checklist, breach and reuse warnings, a confirm field that says when it matches, show/hide toggles, an option to sign out other devices, and a saving → updated state.
Chat message bubbles for both sides of a conversation: runs from the same person group together with tight inner corners and one avatar, outgoing messages show sending, delivered and read ticks, reactions pop in under a bubble, and a typing bubble bounces while someone writes.
The history sidebar of an AI chat app: conversations grouped by date with pinned chats on top, project folders that filter the list, search with highlighted matches, a row menu to rename, pin, archive, move or delete with undo, a collapsible icon rail and a drawer on small screens.
A group of checkboxes with a Select all row that shows a dash when only some are picked, checks that draw themselves, list or card layouts, a maximum that disables the rest, a live count and an error state.
A multi-select onboarding step built from checkbox cards: priced add-ons with a select-all that shows a mixed state, and topics limited to three that lock the rest and shake when you try a fourth. Choices appear as removable chips in a sticky summary with an animated monthly total and Continue.
An onboarding checklist: a progress bar and count up top, round checks that draw in and strike the step through, the next step opening by itself with its own action button, a fold-away header and an all-done state.
A one-page checkout: contact, delivery with shipping method cards (address fields fold away for pickup), card payment with live formatting and checksum validation, inline errors after blur, discount codes, a sticky order summary with a counting total (collapsible on phones) and a processing → confirmed flow.
Your word or logotype cast in liquid chrome: the letters puff up like inflated metal, reflect a bright studio with a crisp horizon, ripple as liquid flows across them and around the pointer, in silver, gold, copper or any tint.