OPEN-CODE UI · 64 STABLE COMPONENTS

Component registry

Add accessible React component source directly to your project. The installer is only a delivery mechanism: the resulting files use Coordiation classes, live in your repository, and remain fully editable.

This is an independent Coordiation registry and installer. It does not install Tailwind CSS or a third-party UI runtime.

Want to compare every preview?Browse the component catalog →

Install Coordiation CSS first

Terminal

npm install @coordiation/css @coordiation/vite

Components contain literal co-* classes. Your existing scanner detects them after the source file is added.

Add a component with Coordiation CLI

Terminal

npx @coordiation/cli@next add component button

The official installer resolves the Coordiation registry, verifies safe target paths, refuses accidental overwrites, and writes the full source into components/ui.

Import the owned source

app.tsx

import { Button } from "@/components/ui/button";

export function SaveAction() {
  return <Button variant="outline">Save changes</Button>;
}

Review and edit the installed file like application code. There is no Coordiation UI runtime to initialize in the browser.

Automate with exact registry data

Discovery endpoints

GET /r/registry.json
GET /r/button.json
GET /component-registry.json
GET /api/components

The compatible catalog and individual item endpoints drive installation. The extended manifest adds stability, client boundaries, usage examples, and accessibility requirements for AI agents.

SOURCE OWNERSHIP

Copy, inspect, customize

The registry gives you code rather than a sealed component dependency.

Keep literal co-* classes discoverable by the compiler.
Preserve native semantics and the documented accessibility contract.
Review registry source before installing updates.
Client components declare their boundary explicitly.
Use the component registry instead of guessing component names.

Interactive catalog← Browse components RelatedIcon library →