Accessible React and Tailwind v4 components, blocks and templates with native-app motion, built-in keyboard, RTL and translation support, and an MCP server for AI agents.
Right-to-left support helpers: useDirection reads the reading direction, DirectionProvider tells Radix-based components, and Dir scopes a region to ltr or rtl.
A macOS-style dock whose icons grow with spring physics as the pointer approaches and push their neighbors apart. Labels, running dots, a launch bounce and arrow-key navigation included.
App dock example of Dock.
Vertical example of Dock.
A lightweight SVG dot grid background with an optional radial fade and a few softly pulsing glow dots. One pattern element, token colors, hydration-safe, still under reduced motion.
Dense, no glow example of Dot Pattern.
Glowing dots example of Dot Pattern.
A world map built from dots, with pulsing markers, optional labels and animated routes between places, as one lightweight SVG with a text summary for screen readers.
Dense map with labels example of Dotted Map.
Offices with routes example of Dotted Map.
A Mac app download section: app icon and version, an Apple silicon or Intel choice that swaps the file, copyable checksum and Homebrew command, install steps and release notes you can flip between.
Default example of Download 1: Mac app download with release notes.
One build, no notes example of Download 1: Mac app download with release notes.
A swipe-to-dismiss panel from any edge on Vaul, with grab handle, header, scrollable body and footer, drag-safe inner content and reduced-motion handling.
Four directions example of Drawer.
Order review example of Drawer.
An action menu on a trigger with checkbox and radio items, submenus, shortcut hints and destructive rows, built on Radix for full keyboard and typeahead support.
Account menu example of Dropdown Menu.
Radio choices example of Dropdown Menu.
A black pill or MacBook-style notch that morphs between live activities (timers, uploads, an AI thinking state, notifications) with a spring layout animation. Each view is announced politely.
Floating pill example of Dynamic Island.
MacBook notch example of Dynamic Island.
Orange buttons on warm greys with tighter corners. Energetic but readable.
A responsive empty-state surface with media, concise guidance, and a dedicated action area.
Overview example of Empty.
A ready-to-use empty screen with guidance and primary and secondary action slots.
Overview example of Empty State.
States and variants example of Empty.
States and variants example of Empty State.
A .env editor with masked values, show and hide, name validation and duplicate detection, paste-to-import for whole .env files, and copy as .env.
Controlled with a live .env preview example of Env Editor.
Project variables example of Env Editor.
An error page with giant fading numerals whose zero is a ring with an orbiting moon, plain-language copy per status, home and back buttons, site search and helpful links.
404 example of Error 1: friendly 404, 403 and 500 page.
500 with reference example of Error 1: friendly 404, 403 and 500 page.
Frequently asked questions in an accessible accordion, with the heading and a help line in a side column on desktop.
Default example of FAQ 1: accordion with heading.
Frequently asked questions with live search that highlights matches, topic filters with counts, a friendly empty state and a support prompt. Topics scroll sideways on phones.
Default example of FAQ 2: searchable with topic filters.
Two topics example of FAQ 2: searchable with topic filters.
Bento feature grid of spotlight cards in two sizes, with an animated stat and keyboard-shortcut hints mixed in for texture.
Default example of Features 1: bento grid.
Six features in a hairline grid of numbered cells with an icon, title and one sentence each. Pass your own features array.
Default example of Features 2: numbered icon grid.
Integrations section: heading, description and checked benefits beside a hub diagram where animated beams flow between your product and six tools.
Default example of Features 3: integrations hub with beams.
Bento feature grid for a desktop app: menu bar companion, keyboard shortcuts, privacy, iCloud sync and notifications, each with a small live visual.
Default example of Features 4: Mac app bento.