Copy-and-own React components for Tailwind CSS 3 and 4: forms, overlays, site chrome, motion, animated text and backgrounds.
Stacked sections that open and close under their headings, one or several at a time, with a height animation.
Callout for important messages on a neutral surface; default, success, warning and destructive tones colour the icon.
Modal that asks the user to confirm or cancel before an action, with action and cancel buttons.
A border with a light travelling around it, paused off screen.
One or more series as gradient-filled areas, stacked or overlapping, with a legend and a keyboard slider over the points.
Slow, soft light drifting behind its content, from three radial gradients.
A round picture of a person with a fallback while it loads or when it fails, in three sizes, plus an overlapping group.
Short status or metadata label. Solid, secondary and outline styles, plus success, warning and destructive statuses shown as a coloured dot.
One series as vertical or horizontal bars that grow in on first view, with a keyboard slider over the bars.
Twelve bars around a hub fading in turn, announced as Loading. No JavaScript.
Text that comes into focus one character at a time, and can blur back out.
The trail of links from the top of a site to the current page, with separators and an ellipsis.
A browser window drawn in CSS around a page or a screenshot, with window dots, an address field and optional actions.
Triggers an action. Variants default, secondary, outline, ghost, destructive and link; sizes sm, default, lg and three square icon sizes. Supports asChild and a loading state.
Month grid for picking a date, several dates or a range, with dropdown captions and week numbers. Built on DayPicker.
A closing band with a title, a description and one or two actions.
Container with header, title, description, action, content and footer parts.
Slides on a native scroll-snap track, with keyboard steps, previous and next buttons, dots and an optional coverflow look.
Checkbox with checked, unchecked and indeterminate states.
A block of code with an optional caption, a language label and a copy button.
A region that a trigger button shows and hides, with a height animation.
Pick one colour from a row of swatches: a radio group with arrow keys and form support.
A select with a search box, for long lists of options.
Searchable list navigated with the arrow keys; the base for comboboxes and command menus.
A contact section with a header, contact details and a validated message form that reports pending, success and error states.
A menu of actions for an area of the page that opens on right click or long press, with checkbox and radio items, labels, shortcuts and submenus.
An icon button that copies a value and swaps to a check mark, announcing it to screen readers.
A box with bracket marks on its corners, in any size, thickness, colour and inset.
A dot and a trailing ring that follow a mouse pointer, growing over interactive elements and showing labels.
An application page with a collapsible sidebar, a header, stat cards, a line chart and a recent-activity table.
A pill button whose fill gives way to a dashed outline that marches on hover.
A table with sortable headers, a text filter, pagination and row selection, built on TanStack Table v9.
DatePicker and DateRangePicker: a calendar in a popover behind a button that shows the chosen date or range.
Modal window centred over the page, with a focus trap, overlay, close button, header, footer, title and description parts.
Words or characters surfacing at scattered moments, the same on server and client.
A floating bar of icon links pinned to the bottom or top of the viewport, with tooltips and an optional reveal after scrolling.
Parts of a whole as a ring with the total in the middle and a keyboard-navigable legend of values and shares.
A bottom sheet dialog for phones that can also be dragged down to close.
A menu of actions and options that opens from a button, with checkbox and radio items, labels, shortcuts and submenus.
A file drop area on a native file input that checks type, size and count, and lists the chosen files.
What a list, table or page shows when it has nothing in it yet, with an icon, title, description and actions.
A frequently asked questions section with a header and the answers in an accordion, split or stacked.
A grid of features with an icon, a title and a description under a centred section header.
Layout for a control with its label, description and error, plus fieldset and group helpers. Independent of any form library.
A card with two faces that turns over in 3D on hover, from a trigger, or from a prop.
Kinetic type in 3D: characters or words turning into place around their horizontal axis, one after another.
FormField: a react-hook-form Controller laid out with Field, with the id, label and ARIA wiring done for you.
Title, artist, cover and preview clip for a Spotify link, read on the server from the public embed page.