Chakra UI

114 accessible React components with a token-driven styling system

Tier S · Best in classComponent LibraryPrimitivechakra-ui.com

(Visit chakra-ui.com ↗)(Docs)(Repository)(Registry)

Chakra UI is a React component system built on Ark UI and Zag.js state machines, with a token-based styling engine and first-class dark mode. Version 3.36.1 documents around 114 components across layout, typography, forms, collections, overlays, feedback and data display, installed as an npm package and scaffolded with a CLI snippet command. It ships an official MCP server and llms.txt files, so agents can query components and theme tokens directly. Chakra UI Pro adds paid pre-built pages and templates.

Install

npm i @chakra-ui/react @emotion/react && npx @chakra-ui/cli snippet add

For an agent

Reach for Chakra instead of shadcn/ui when the team wants a versioned dependency they can upgrade rather than owned source files they must maintain, and when they need breadth — date picker, colour picker, splitter, rich text editor and tree view all exist here and do not in a stock shadcn install. Always run `npx @chakra-ui/cli snippet add` after installing: v3 splits primitives from the composed snippets, and code written against v2's prop API will not compile. Best of all, add the MCP server with `claude mcp add chakra-ui -- npx -y @chakra-ui/react-mcp` and call list_components and get_component_props rather than guessing — and use the v2_to_v3_code_review tool on any legacy Chakra codebase before touching it.

Why it is here. One of the few large React libraries that is simultaneously accessibility-serious, actively shipping, and genuinely agent-legible — llms.txt, an official MCP server, and 40k stars behind it.

Install command, framework, licence and component list.

Facts

License: MIT
Pricing: Open source, Free, Freemium
Framework: React, Next.js, Remix
Styling: CSS-in-JS, CSS custom properties
Distribution: npm package, CLI installer, Copy-paste snippet, GitHub repository, MCP server
Platform: Web
Content type: Code, Design tokens / theme files, Prose / writing
Agent readiness: MCP server, llms.txt, Structured documentation, CLI installable, Readable open source
Accessibility: Full ARIA pattern implemented, Keyboard navigable, Focus management and visible focus, Built on accessible primitives, RTL and i18n aware, Accessible
Maturity: Actively maintained
Pricing detail: Core library is free and MIT. Chakra UI Pro (pro.chakra-ui.com) sells pre-built application, marketing and e-commerce pages; a Pro licence also unlocks the list_component_templates and get_component_templates MCP tools. Exact Pro prices were not shown on the pages fetched.
GitHub stars: 40,577
Package: @chakra-ui/react

Components it ships

114 total

Helps you build

Notable for

v3.36.1, ~114 documented components
official @chakra-ui/react-mcp MCP server
llms.txt plus per-topic llms-*.txt sets
built on Ark UI and Zag.js state machines
40,577 GitHub stars, MIT, pushed today

Provenance

Verified 2026-08-15. HTTP 200. WebFetch https://chakra-ui.com/, WebFetch https://chakra-ui.com/docs/components/concepts/overview (full component list by category), WebFetch https://chakra-ui.com/docs/get-started/installation (exact install + CLI snippet command, v3.36.1, framework guides), WebFetch https://chakra-ui.com/docs/get-started/ai/mcp-server (MCP add command and tool list), curl https://chakra-ui.com/llms.txt (200), GitHub API chakra-ui/chakra-ui (40577 stars, MIT, pushed 2026-08-15), npm registry @chakra-ui/react@3.36.1

Also in Component Libraries

chakra-ui.comTier S