# Arc ships React components as source you copy into your repo > Arc is a library of 114 React components and 22 blocks with motion built in, distributed through the shadcn registry or as plain files you copy, styled with CSS modules over a small set of design tokens and paired with a reduced motion path. It suits teams that want owned source rather than a dependency. **kuratlielia/arc-library** — Arc Library: free, open source React components with calm motion. Copy the code or install with the shadcn CLI. - Repository: https://github.com/kuratlielia/arc-library - Website: https://uiarc.dev - Stars: 988 · Forks: 46 - Language: TypeScript - License: MIT - Published: 2026-10-20 · Updated: 2026-10-20 · Language: en - Canonical page: https://hysenlabs.com/projects/kuratlielia-arc-library ## Plain source you own rather than a dependency The delivery model is the defining decision, and it is stated in the first paragraph. Every item is plain source you own, made of CSS modules on a small set of design tokens, using Motion for animation, with keyboard support and a reduced motion path for every animation. You can install anything with the shadcn CLI or copy the files by hand. The consequence for a team is worth being explicit about: because the code lands in your repository, you can change a component's internals, adapt it to your own conventions and delete what you do not need, and no upstream release can break your build. The cost is that you now maintain that code, and the upstream project cannot push a fix into your tree. ## 114 components and 22 blocks, and a paid tier kept separate The badges give the size of the free set, 114 components and 22 blocks, plus the design and motion tokens they share, and every one of them has a live preview on uiarc.dev. The showcase table marks some entries as Pro, which the README explains are part of Arc Pro and are not in this repository, while everything else installs from here for free. The named free examples read like a catalogue of motion patterns rather than generic widgets. The donut chart morphs arcs between datasets while the total rolls into the center, the billing toggle rolls monthly and yearly prices into each other with the savings included, the line chart redraws against the previous period when the range changes, and the number field has bounded steppers that say so when you reach the limit. ## Motion, keyboard support and a reduced motion path Motion is not an add-on in this library, it is a layer of the components themselves, and the phrase in the project description is calm motion. The animation library is Motion, the React animation package from motion.dev, and it is listed in the development dependencies at version 13. The accessibility story is stated as a property of every item: keyboard support and a reduced motion path for every animation. That last point is the one that separates this from a demo-heavy component set, because a motion library that ignores the user's motion preference is a problem in any product with a public audience. The repository also points to a dedicated AI and MCP section in its documentation, so agents are given the same rules the components follow. ## CSS modules and tokens, and no Tailwind requirement The styling approach deserves attention because it cuts against the current default. The components are built with CSS modules on a small set of design tokens, and the README says the library works in Next.js and Vite, with or without Tailwind. That is a real difference of approach rather than a detail, because most of the shadcn ecosystem assumes Tailwind utility classes in your JSX, which then ties your component code to your styling toolchain. With CSS modules, the markup ships with its own class names, the tokens carry the design decisions, and a project without Tailwind can still adopt the set. A project with Tailwind can still adopt it, which is what the with or without wording means. ## Installing through the registry or by copying files There are two documented routes. The shadcn route uses the CLI against the project's registry, whose badge names it `@uiarc`, with the installation instructions on the documentation site at uiarc.dev. The manual route is to copy the component files into your own project and adjust the imports. Two details from the package metadata are worth knowing before you start. The package is marked `"private": true`, which means the library is not consumed as a published npm dependency but distributed as source through the registry, and the engine requirement is Node 20 or later, with `"node": ">=20"` in the manifest. The package name is `arc-library`, the version in the manifest is a development placeholder of `0.0.0`, and the licence field is MIT. ## A registry that is checked in CI The repository treats the registry as data. There is a `registry.json` file at the root alongside a `registry/` directory, and the package scripts include a check that runs `node scripts/check-registry.mjs`. The full check is the combination of a typecheck, a lint pass and that registry check, and the manifest spells out the sequence: ```bash npm run typecheck && npm run lint && npm run check:registry ``` The typecheck is `tsc --noEmit` and the lint step is `eslint .`, with the ESLint configuration in `eslint.config.mjs`. The components themselves live under `lib/`, the types under `types/`, and there is a `public/` directory for assets, with `scripts/` holding the tooling. It is a layout that assumes the registry entries and the shipped files are kept in step, which is what the registry check is for. ## MIT licensing, a single tagged release, and a moving main branch The licence is MIT, which in short terms lets you use, modify, redistribute and sell the components, with the copyright notice and the licence text kept with the copies. That is the right licence for a copy-in model, since you are copying source rather than linking a library. The release history is short, with a single tag, Arc v1.0.0, published on 2026-09-29, while the last push to the repository was on 2026-10-19, so work is continuing on the main branch after the 1.0 tag. The repository is not archived. It also carries the usual governance files, a `CONTRIBUTING.md`, a `CODE_OF_CONDUCT.md` and a `SECURITY.md`, plus a `CHANGELOG.md` for tracking what changed between versions of the components you have copied. ## Conclusion Adopt Arc when your team wants component source in its own repository, with animation, keyboard support and a reduced motion path already handled per component, since every item installs as plain files over a shared set of design and motion tokens. Do not adopt it expecting a published npm package or a Tailwind requirement, because the package is marked private and the components use CSS modules, working with or without Tailwind. Verify first that the free set covers the components you need, since the showcase marks several items, including cover flow, orbit logos, wallet stack and activity rings, as Arc Pro and outside this repository. ## FAQ ### How do I install the Arc React components? Through the shadcn CLI using the `@uiarc` registry, following the installation instructions on uiarc.dev, or by copying the component files into your project by hand. The library works in Next.js and Vite, with or without Tailwind. ### Is Arc published as an npm package I can add as a dependency? No. The package manifest marks it as private, and the components are distributed as source through the shadcn registry or by copying the files, so the code lives in your repository. ### What is included in the free Arc repository? 114 components and 22 blocks plus the design and motion tokens they share. Items marked Pro, such as cover flow, orbit logos, wallet stack and activity rings, belong to Arc Pro and are not in the repository. ### Does Arc handle reduced motion and keyboard navigation? Yes. The README states that every component includes keyboard support and a reduced motion path for every animation, with Motion used for the animation itself. ## Sources - [kuratlielia/arc-library on GitHub](https://github.com/kuratlielia/arc-library) - [License: MIT](https://github.com/kuratlielia/arc-library/blob/main/LICENSE) - [Project website](https://uiarc.dev) - [README](https://github.com/kuratlielia/arc-library/blob/main/README.md) - [Releases](https://github.com/kuratlielia/arc-library/releases) --- Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/kuratlielia-arc-library