A design system, a React library and a Figma file that all resolve to the same values.
AntUIKit is a full Figma design system built on top of Ant Design, covering tokens, components, patterns and the foundations underneath them. It ships with a matching React library on Ant Design v6, React 19 and Tailwind v4, so design and code follow the same structure and the same names.
Components are not installed as a package. They are copied into your project from a registry, and from that point the file is yours to edit. What stays shared is the layer below: the token contract that decides what primary means, what a control is tall, and how a corner rounds.
You own the components. The system owns the values.
The breadth a real product needs is already there, and it is maintained by someone else.
Most copy-paste kits start from a headless primitive library and rebuild the hard components by hand. That works until a product asks for a data table with sorting and row selection, a date range picker that understands locales, a form with nested validation, a tree with drag and drop, or a transfer list. Ant Design has all of them, tested against a decade of enterprise use, with internationalisation and right-to-left support in the same box.
AntUIKit does not replace any of that. Each component in the registry is a thin layer over antd's own, and every antd prop keeps working. What it adds is the visual identity and the link to Tailwind.
One command copies the file in. After that there is nothing between you and the code.
The registry is served from ui.antuikit.com/r/*.json, and the antuikit CLI installs from it.
Each component installs only what it needs. The kit's build checks every component's declared dependencies against the CSS it compiles to, so the list stays right.
antd token name, CSS variable, Tailwind theme key. One value, three places to spend it.
The canonical names are Ant Design's own token names. Every Tailwind theme variable maps to one of them, so a utility class and an antd component read the same CSS variable and cannot drift apart.
The values live in one JSON file per theme, holding seeds and the deviations you choose, not resolved values. An Ant Design upgrade that improves a derivation moves your theme forward with it.
Browse every token across light, dark and compact, or read how a theme file is written on the Theming page.
A Tailwind utility beats an antd style, with no exclamation marks anywhere.
Fighting a component library's own CSS is usually a specificity war. Here it is settled once, by cascade layers. Your Tailwind entry stylesheet declares the order before anything else loads, and antd injects its styles into the antd layer, which sits below utilities.
Keep the @layer line first. CSS orders layers by where they are first named, so it has to come before the Tailwind import. The CLI writes it for you.
The kit never uses !important, and you should not need it either.
The design file is not a picture of the library. It is the other end of the same contract.
Foundations in Figma are variables, and those variables carry the same token names the React side uses. Changing a color, a radius, a spacing step or a type ramp moves both, because both compile from the same theme file. Component properties in Figma mirror the React props, so a handoff note can name a prop instead of describing a look.
Light, dark and compact are modes inside one theme, not separate files, so a brand color cannot drift between them.
Components are the foundation. Most of the work happens in the layers above them.
The docs are readable by the tools your team already codes with.
Every component page can be read as plain Markdown, handed to Claude, ChatGPT or v0 in one click, and the whole documentation set is summarized in an llms.txt file. Because components arrive as source in your repository rather than as a compiled dependency, an assistant can read what it is editing.
Three doors, depending on what you came here to do.
The short answers. The full list lives on the FAQ page.