Search documentation
Search pages, components, blocks, styles and colours.
How the @fabricator registry works, and how to use it from an existing project.
Fabricator UI is distributed as a registry. Components, blocks, hooks, themes and the init payload are served as JSON from https://fabricator-ui.vercel.app/r, and the CLI installs them into your project as source code.
The registry follows the shadcn registry format. That means it also works in existing shadcn/ui projects and with the shadcn CLI. This page explains how.
There is no package to install. Any project with a components.json can use the registry, whether it was created with fabricator-ui init or with shadcn init.
Namespaces
The CLI installs items from namespaced registries with the @namespace/name syntax. Fabricator UI uses the @fabricator namespace:
A bare name, such as button, always resolves to the upstream shadcn/ui registry. Fabricator items depend on each other with fully qualified names (@fabricator/button), so installing a Fabricator component never pulls in an upstream item by accident.
The fabricator-ui CLI maps bare names to @fabricator for you:
To keep a bare name as it is and install the upstream shadcn/ui item, pass --upstream:
How @fabricator resolves
The CLI looks up the namespace in the registries field of your components.json and fills in the URL template:
{
"style": "base-nova",
"registries": {
"@fabricator": "https://fabricator-ui.vercel.app/r/fabricator/{style}/{name}.json"
}
}{style} is replaced with the style field of your components.json (for example base-nova) and {name} with the item name. npx shadcn@latest add @fabricator/button then fetches https://fabricator-ui.vercel.app/r/fabricator/base-nova/button.json.
The base (base, radix or aria) is read from your style field, and the visual style is always Fabricator's. Colours, radius and fonts come from your theme, so components follow the theme you already have.
The style field always holds a valid shadcn style id, such as base-nova. It is never set to a Fabricator style. Bare names and third-party items are resolved against shadcn/ui with that same field, so a custom style id would make them fail.
Projects set up with the earlier https://fabricator-ui.vercel.app/r/{style}/{name}.json URL are redirected to the same items. Update the URL when you can; npx fabricator-ui@latest doctor flags it.
Add the registry to an existing project
In a project that already uses shadcn/ui, run init:
It offers two options:
- Add registry only: writes the
@fabricatorentry tocomponents.json. Your theme, fonts and existing components are not changed. - Apply theme: adds the registry and applies a Fabricator preset to your theme and fonts.
To do it by hand, add the URL above to the registries field of your components.json. See components.json.
New projects
init in an empty directory creates a project with the registry already configured:
With the shadcn CLI, pass the Fabricator init URL instead:
See Installation for every framework.
Search and view
List or search the items in the registry:
Inspect an item, including its files and dependencies, before installing it:
The fabricator-ui CLI has the same commands without the namespace: npx fabricator-ui@latest search date and npx fabricator-ui@latest view button. See CLI.
MCP
The Fabricator MCP server reads the registries in your components.json, so your AI assistant can browse, search and install @fabricator items. See MCP Server.
Open in v0
Every registry item is a public JSON URL, so you can open it in v0 like any other registry item:
https://v0.dev/chat/api/open?url=https://fabricator-ui.vercel.app/r/fabricator/base-nova/button.json