# Create UI > Create UI is a design code system. Open-code components and one semantic token system you own and theme, built on Radix UI, CVA, and Tailwind CSS v4. Every component lives in your repo as editable code. One foundation drives many themes through semantic tokens (e.g. `bg-error-base`, `text-body`, `shadow-neutral-md`), so retheming once updates everything and dark mode comes for free. A flat-file registry and CLI move components between projects and frameworks, and the same registry powers an MCP server so AI agents can browse, search, and install components. ## Getting Started - [Introduction](https://createui.co/docs): What Create UI is — open code, one system with many themes, composition, beautiful defaults, distribution, and AI-ready design. - [Installation](https://createui.co/docs/installation): Start a new project with Create UI, or add it to one you already have. - [Components](https://createui.co/docs/components): The full set of available components, each with live examples. - [MCP Server](https://createui.co/docs/mcp): Use the Create UI MCP server to browse, search, and install components from registries with AI agents. - [Changelog](https://createui.co/docs/changelog): Latest updates and announcements. ## Foundation - [Typography](https://createui.co/docs/typography): One type system, seven token families, applied with a single utility class. - [Spacing](https://createui.co/docs/spacing): Responsive, semantic spacing tokens for layout, section, and component rhythm. - [Rounded](https://createui.co/docs/rounded): Responsive, semantic border-radius tokens that scale corners across breakpoints. - [Colors](https://createui.co/docs/colors): Semantic color tokens for theming, dark mode, and consistent UI. - [Shadows](https://createui.co/docs/shadows): Semantic shadow tokens for elevation, component states, and depth. ## Components - [Accordion](https://createui.co/docs/components/accordion): Stacked disclosure rows that expand a single panel at a time or many in parallel. - [App Store Badge](https://createui.co/docs/components/app-store-badge): Branded download CTA for app stores, browser extension marketplaces, and music services. - [Aspect Ratio](https://createui.co/docs/components/aspect-ratio): Reserves a fixed width-to-height ratio for media and embeds so the layout stays put while they load. - [Avatar](https://createui.co/docs/components/avatar): Image, initials, or icon thumbnail with optional status badge, ring, and grouping. - [Badge](https://createui.co/docs/components/badge): Compact label for statuses, counts, and metadata. - [Breadcrumbs](https://createui.co/docs/components/breadcrumbs): Hierarchical nav trail that shows the path from the app root to the current page. - [Button](https://createui.co/docs/components/button): Interactive control for primary actions, form submission, and inline triggers. - [Button Group](https://createui.co/docs/components/button-group): Joined row of buttons that share a single bordered surface for segmented toolbars and view switchers. - [Checkbox](https://createui.co/docs/components/checkbox): Boolean toggle for binary choices in forms, lists, and bulk-selection rows. - [Checkbox Group](https://createui.co/docs/components/checkbox-group): Labelled checkbox row that pairs a single Checkbox with a label, description, and error footer. - [Chip](https://createui.co/docs/components/chip): Compact interactive label for selection, filtering, and tagging. - [Close Button](https://createui.co/docs/components/close-button): Compact icon button for dismissing dialogs, toasts, banners, and other overlays. - [Dropdown Menu](https://createui.co/docs/components/dropdown-menu): Action menu that opens from a button, for account controls, row actions, and overflow commands. - [Field](https://createui.co/docs/components/field): Layout wrapper that pairs a form control with its label, description, and error. - [Inline Alert](https://createui.co/docs/components/inline-alert): In-flow status surface for system messages and contextual notices anchored to a section. - [Input Stepper](https://createui.co/docs/components/input-stepper): Numeric input with attached increment and decrement buttons for tight quantity controls. - [Input](https://createui.co/docs/components/input): Single-line text field for capturing short user input such as names, emails, numbers, and queries. - [Input Group](https://createui.co/docs/components/input-group): Compound input shell that composes Input with icons, addons, buttons, and selects inside a single bordered row. - [Input OTP](https://createui.co/docs/components/input-otp): One-time-code input that splits each character into its own slot. - [Label](https://createui.co/docs/components/label): Caption for a form control, with slots for icons, markers, badges, tooltips, and counters. - [Pagination](https://createui.co/docs/components/pagination): Numbered navigation for splitting long lists across pages. - [Progress](https://createui.co/docs/components/progress): Bar or ring that shows how far a known task has advanced. - [Radio](https://createui.co/docs/components/radio): Single-choice form control for mutually-exclusive options inside a RadioGroup. - [Radio Group](https://createui.co/docs/components/radio-group): Single-select form group with shared label, helper text, and error footer. - [Scroll Area](https://createui.co/docs/components/scroll-area): Styled scroll container with overlay scrollbars for vertical, horizontal, or both axes. - [Segmented Control](https://createui.co/docs/components/segmented-control): Single-select switcher for 2 to 5 inline options, with a flat row or grouped pill style. - [Select](https://createui.co/docs/components/select): Dropdown for choosing one value from a short list, with built-in keyboard, focus, and form-field composition. - [Separator](https://createui.co/docs/components/separator): Thin horizontal rule for breaking content into visual sections, with optional inline label. - [Social Login Button](https://createui.co/docs/components/social-login-button): Branded sign-in button for OAuth flows across the major social providers. - [Spinner](https://createui.co/docs/components/spinner): Indeterminate loading indicator for async work in buttons, forms, and inline content. - [Status Badge](https://createui.co/docs/components/status-badge): Colored dot that signals presence or live state next to a label, avatar, or row. - [Switch](https://createui.co/docs/components/switch): Toggle control for on/off settings that commit immediately. - [Tab Menu](https://createui.co/docs/components/tab-menu): Compound menu for switching between sections, with vertical or horizontal layouts and an animated active indicator. - [Textarea](https://createui.co/docs/components/textarea): Multi-line text input for longer prose, with built-in size, state, and resize controls. - [Text Link](https://createui.co/docs/components/text-link): Inline anchor for in-body links that stay inside the flow of text. - [Toast](https://createui.co/docs/components/toast): Transient, screen-level notification that confirms an action or surfaces a short-lived message. - [Tooltip](https://createui.co/docs/components/tooltip): Short hover hint that names a control or explains a brief detail. ## Tools - [CLI](https://createui.co/docs/cli): Use the createui CLI to add components to your project. - [Agent Skill](https://createui.co/docs/skill): Install the Create UI skill so your AI coding agent writes correct Create UI code. - [Figma](https://createui.co/docs/figma): Every component recreated in Figma, with customizable props, typography, and icons. ## Schemas - [Registry Schema](https://createui.co/schema/registry.json): JSON Schema for registry index files. Defines a collection of components, hooks, pages, and other items. - [Registry Item Schema](https://createui.co/schema/registry-item.json): JSON Schema for individual registry items, with properties for dependencies, files, Tailwind config, CSS variables, and more.