Accessible React components with motion editions, plus free blocks for dashboards and landing pages. MIT.
Page not found, with a search across the pages people likely wanted, a way back and home, popular pages and a report link.
Vertically stacked sections that expand to reveal content.
Accordion with motion: a section opens and closes on a spring, what's inside rises a little as it fades in, and the chevron turns with the panel as far as it has opened.
The bar that rises while rows are selected: the count, actions for them, and a way to clear.
A whole assistant screen: starter cards, reasoning, tool calls, an approval before it emails anyone, and a streamed answer, with past conversations beside it.
A callout that draws attention to important information.
A question that has to be answered before anything else: Cancel, or confirm what can't be undone.
AlertDialog with motion: it grows out of its button, its icon pops in, a click outside shakes it because it needs an answer, and confirm can be a press-and-hold.
An AI assistant asking before it acts: what it wants to do, exactly what that means, and Approve or Deny.
Values over time as filled areas: one series, several, or stacked into a total, with a dashed one for a comparison. Plain SVG.
A box that keeps its shape as it resizes, for an image, a video or a map.
A text field that suggests as you type, where any text is still a valid answer.
An image element with a fallback for representing a user, and a group that stacks several.
A small label for statuses, counts and categories.
Badge with motion: a new count rolls up or down while the badge glides to its width, a new color pulses the dot, and it pops in when added.
A strip across the page for news that concerns everyone: a launch, a sale, planned downtime.
Values compared across categories or periods as bars: one series, several side by side, or stacked. Plain SVG.
Values side by side as labelled bars: top products, traffic sources, storage by type.
Shows where a page sits in the site's hierarchy, with links back up to each level.
Triggers an action. Sixteen variants — solid, soft, outline, ghost and link — four sizes, each with a square one for an icon alone, a loading state, and can render as a link.
Buttons that belong together, joined into one control.
Button with motion: it presses in on a spring, a new label crosses over while the button glides to its new width, and loading pops the spinner in.
A date grid for picking a day or a range, built on DayPicker.
Prices over time as candles, like a trading chart: open, high, low and close per period, with volume. Plain SVG.
A container that groups related content and actions — from simple panels to image-rich product, article and profile cards.
Slides in a row to swipe or step through, with arrows, dots, looping and autoplay.
An announcement, a big promise and two actions, centered on a glow with a faint grid, and the customers below.
What AreaChart, LineChart and BarChart share: their props, the scales, the round ticks, the curves, stacking, the
A control that toggles between checked and unchecked.
Several checkboxes under one label, to pick any number of options.
Checkbox with motion: the tick draws itself along its stroke as it's checked and back out as it's cleared, and the box presses in on a spring.
Merges class names and resolves Tailwind CSS conflicts.
Code to read and copy, with a file name or tabs, line numbers and marked lines.
One section that opens and closes under its title.
A hex field with a swatch that opens saturation, brightness and hue, presets and a pick from the screen.
Four columns of links, a newsletter sign-up that checks and confirms, and a language select and theme switch.
A searchable select — type to filter a long list of options.
A fast, filterable command menu — inline or as a ⌘K palette.
A menu that opens on right-click or long-press, with shortcuts, checkboxes, radio items and submenus.
The scrolling part of a chat with an AI assistant: it follows the newest message while it streams, inside a panel that keeps its height.
Copies a value in one tag: an icon button with a tooltip, or a button with a label, that turns into a check and says "Copied".
Time left until a moment, ticking each second, with unit names in the reader's language.
The simplest ask: one banner with a gradient hairline around a soft tint, the promise on one side and two actions on the other.
The promise and two actions on a soft glow, with what's included and the people already using it.
A last call to action on a soft glow with the reassurance under it, then the links and the copyright.
Start the sign-up right there: an email field that checks the address and turns into “check your inbox”, beside the product.
A sidebar toggle and breadcrumb, ⌘K search, notifications and the account menu.
Grouped pages with counts, a section that opens, a plan card and the account menu; collapses to a rail of icons.