# Chakra UI

Chakra UI is a component system for building SaaS products with speed ⚡️

Repository: https://github.com/chakra-ui/chakra-ui
Canonical: https://ross.abutalabs.com/products/chakra-ui
Homepage: https://chakra-ui.com
Language: TypeScript
License: MIT
License Family: permissive
Topics: chakra-ui, react, uikit, react-components, accessible, a11y, wai-aria, reactjs, dark-mode, ui-components, ui-library, ark-ui, design-system, component, styled, css-in-js
Last push: 2026-08-24T17:07:26+00:00
Link (homepage): https://chakra-ui.com
Link (site_page): https://chakra-ui.com/docs/get-started/installation

## Health v2 (maintenance only)
Score: 93/100 (v2, computed 2026-09-03T02:39:23.370411+00:00)
- activity 99, release rhythm 81, longevity 100
- inputs: {"age_days": 2573, "days_push": 9, "days_rel": 45, "gap_med": 0, "n_releases_24m": 222}
- flags: none
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 40597, forks 3639 (observed 2026-08-28T04:12:08.277755+00:00)

## What it is
Chakra UI is an accessible React component library and design system for building web applications quickly, with semantic tokens, styling recipes, and dark mode support. It works with frameworks like Next.js and Vite and is backed by the Ark UI headless component ecosystem.

## Use cases
- build accessible react apps
- create a design system for a saas product
- add dark mode to a react app
- build a dashboard ui quickly with prebuilt components
- style react components with semantic design tokens
- build a wai-aria compliant component library
- set up ui components in next.js app router

## When to choose
- you are building a React web app and want accessible, WAI-ARIA compliant components out of the box
- you need rapid SaaS product development with a themable design system
- you want dark mode, semantic tokens, and component recipes with minimal setup
- you work with Next.js, Vite, or Remix and want first-class integration guides

## When to avoid
- your project is not React-based (consider Chakra UI Vue or another ecosystem library)
- you need zero-runtime CSS with minimal bundle overhead and prefer a utility-first approach like Panda CSS or Tailwind
- you need fully custom, unstyled headless primitives only (consider Ark UI directly)
- you are building a non-web platform such as native mobile or desktop apps

## Facets
- artifact type: library
- maturity: stable
- function: ui-components, css-framework, frontend-framework, theme
- domain: web-development, frontend, web-design, accessibility
- platform: cross-platform
- tags: react, design-system, accessibility, wai-aria, dark-mode, css-in-js, component-library, typescript, nextjs, nodejs, web-server

## Member repositories
- chakra-ui/chakra-ui (main) score 93
- chakra-ui/chakra-ui-vue (sdk) score 10

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:12:08.277755+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-29T16:23:27.807434+00:00, confidence not recorded.
  - readme: https://github.com/chakra-ui/chakra-ui (fetched 2026-08-28T04:12:08.277755+00:00, sha 40df950c7d56)
  - homepage: https://chakra-ui.com (fetched 2026-08-29T07:46:59.407192+00:00, sha a8da4753c20c)
  - site_page: https://chakra-ui.com/docs/get-started/installation (fetched 2026-08-29T07:46:59.416510+00:00, sha 02b7018f1178)
- Data as of 2026-08-30T08:39:29.467469+00:00.
