Start here
Install with shadcn, and the docs MCP
Every object and block is in a registry that the shadcn CLI reads, and the docs answer agents over MCP. Your agent installs a piece instead of writing one.
Install a free piece
No account, no setup:
npx shadcn add https://tactileui.dev/r/odometer.jsonThe piece lands in tactile/odometer/ (inside src/ when the project has a src/ folder, so src/tactile/odometer/ in a Vite app): its class, its stylesheet and example.html, the page that runs it. The list of everything is at /r/registry.json.
The shadcn CLI needs a components.json in the project even for this. If yours has none, make it, and the jsconfig.json, from the next section first; the registries part of it is only for Pass pieces.
Install what your Pass opens
Make a token on your account and keep it in your environment, never in the repository. In a shell on macOS or Linux:
export TACTILE_TOKEN=tui_pat_…and in PowerShell on Windows:
$env:TACTILE_TOKEN = "tui_pat_…"Then name the registry once in components.json, at the root of your project. shadcn will not install anything without one, and a fresh project has none, so this is the whole file to make; the registries part is Tactile's, the rest is what shadcn needs and does not use here:
{
"$schema": "https://ui.shadcn.com/schema.json",
"style": "new-york",
"tailwind": { "css": "src/index.css", "baseColor": "neutral", "cssVariables": true },
"aliases": { "components": "@/components", "utils": "@/lib/utils" },
"registries": {
"@tactile": {
"url": "https://tactileui.dev/r/{name}.json",
"headers": { "Authorization": "Bearer ${TACTILE_TOKEN}" }
}
}
}shadcn also reads the @/ alias from jsconfig.json (or tsconfig.json). A fresh Vite app has neither, and shadcn stops with "Couldn't find tsconfig.json". Add this next to components.json:
{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["./src/*"] } } }Install by name:
npx shadcn add @tactile/pin-screenA token opens what your account owns now, checked on every request. Stop one on your account page and it stops at once. Installing a piece hands over its code, so on a Pass with the 14-day refund it counts as a download.
Fonts are binary files, which a registry item cannot carry. The install says which ones a piece uses; they come with its download on its page.
The docs, for your agent
The docs are an MCP server at https://tactileui.dev/mcp, read-only: search the docs, read a page, list the pieces. It gives the words a visitor reads, so it needs no token.
Claude Code:
claude mcp add --transport http tactile-ui https://tactileui.dev/mcpCursor, in .cursor/mcp.json:
{ "mcpServers": { "tactile-ui": { "url": "https://tactileui.dev/mcp" } } }VS Code, in .vscode/mcp.json:
{ "servers": { "tactile-ui": { "type": "http", "url": "https://tactileui.dev/mcp" } } }Then ask for a piece by what it should do, and the agent finds it, reads its page and installs it.