Arc

Overview

Arc (uiarc) is a library of animated React components and blocks for shadcn/ui and Next.js, designed so AI agents can build with it. The site lists 185 animated components and 110 blocks, which can be added with the shadcn CLI or through an MCP server. Every component has a Markdown docs page and there is an llms.txt index, so tools like Claude, Cursor and Codex can install components correctly.

The free registry exposes 143 items, including foundation styles, motion tokens and an agent skill. Motion-heavy components marked Pro, most of the complete blocks and new Pro releases are part of the paid Arc Pro tier, a one-time purchase. Every example on the site is live rather than a recording.

Features

• Buttons and actions: Action swap, split button, floating and expanding button groups, copy button, hold to confirm and swipe actions.
• Inputs: Combobox, multi-select, number field, password field with strength meter, tag input, file dropzone, date and time pickers.
• Sliders: Elastic slider and range histogram slider.
• Data display: Sortable data table, filter toolbar, tree view, metric card, sparkline, gauge and animated counter.
• Text motion: Text reveal, in-view title with blur, word, line and wipe variants, text morph and text shimmer.
• Theme switches: Eclipse, split and rise theme switch variants.
• Blocks: Flows such as an availability picker, a wallet with counting balances, an inbox and sign-in forms through to dashboards.
• AI-ready docs: Markdown pages, llms.txt, a shadcn registry and an MCP server.

Tech stack

• React, Next.js, shadcn/ui, Tailwind CSS
• Motion, Radix UI, lucide-react

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @uiarc/component-name