    Skip to content

      Navigation Menu

            Sign in Appearance settings
                * Platform
                        + AI CODE CREATION
                            o GitHub Copilot Write better code with AI
                            o GitHub Copilot app Direct agents from issue to merge
                            o MCP Registry Integrate external tools
                        + DEVELOPER WORKFLOWS
                            o Actions Automate any workflow
                            o Codespaces Instant dev environments
                            o Issues Plan and track work
                            o Code Review Manage code changes
                            o Code Quality Enforce quality at merge
                        + APPLICATION SECURITY
                            o GitHub Advanced Security Find and fix vulnerabilities
                            o Code security Secure your code as you build
                            o Secret protection Stop leaks before they start
                        + EXPLORE
                            o Why GitHub
                            o Documentation
                            o Blog
                            o Changelog
                            o Marketplace
                      View all features
                * Solutions
                        + BY COMPANY SIZE
                            o Enterprises
                            o Small and medium teams
                            o Startups
                            o Nonprofits
                        + BY USE CASE
                            o App Modernization
                            o DevSecOps
                            o DevOps
                            o CI/CD
                            o View all use cases
                        + BY INDUSTRY
                            o Healthcare
                            o Financial services
                            o Manufacturing
                            o Government
                            o View all industries
                      View all solutions
                * Resources
                        + EXPLORE BY TOPIC
                            o AI
                            o Software Development
                            o DevOps
                            o Security
                            o View all topics
                        + EXPLORE BY TYPE
                            o Customer stories
                            o Events & webinars
                            o Ebooks & reports
                            o Business insights
                            o GitHub Skills
                        + SUPPORT & SERVICES
                            o Documentation
                            o Customer support
                            o Community forum
                            o Trust center
                            o Partners
                      View all resources
                * Open Source
                        + COMMUNITY
                            o GitHub Sponsors Fund open source developers
                        + PROGRAMS
                            o Security Lab
                            o Maintainer Community
                            o Accelerator
                            o GitHub Stars
                            o Archive Program
                        + REPOSITORIES
                            o Topics
                            o Trending
                            o Collections
                * Enterprise
                        + ENTERPRISE SOLUTIONS
                            o Enterprise platform AI-powered developer platform
                        + AVAILABLE ADD-ONS
                            o GitHub Advanced Security Enterprise-grade security features
                            o Copilot for Business Enterprise-grade AI features
                            o Premium Support Enterprise-grade 24/7 support
              * Pricing
                Type / to search
                Sign in
              Sign up Appearance settings
      You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

              Uh oh!

              There was an error while loading. Please reload this page.

              chakra-ui / chakra-ui Public

                      * Uh oh!

                        There was an error while loading. Please reload this page.

              * Notifications You must be signed in to change notification settings
              * Fork 3.6k
                * Star 40.6k
          * Code
          * Issues 6
          * Pull requests 11
          * Discussions
          * Actions
          * Security and quality 0
          * Insights
          Additional navigation options
                  * Code
                  * Issues
                  * Pull requests
                  * Discussions
                  * Actions
                  * Security and quality
                  * Insights
                                              main
                                          Branches Tags
                                            Go to file
                                        Code
                                          Open more actions menu

                                        Folders and files

                                          Name                         Name                           Last commit message    Last commit date
                                            Latest commit            
                                                                     
                                                History              
                                                                     
                                                11,550 Commits       
                                                  11,550 Commits     
                                                  .changelog                   .changelog                                                    
                                                  .changeset                   .changeset                                                    
                                                  .claude                      .claude                                                       
                                                  .github                      .github                                                       
                                                  .husky                       .husky                                                        
                                                  .storybook                   .storybook                                                    
                                                  .vscode                      .vscode                                                       
                                                  apps                         apps                                                          
                                                  media                        media                                                         
                                                  packages                     packages                                                      
                                                  sandbox                      sandbox                                                       
                                                  scripts                      scripts                                                       
                                                  skills                       skills                                                        
                                                  .all-contributorsrc          .all-contributorsrc                                           
                                                  .commitlintrc                .commitlintrc                                                 
                                                  .gitignore                   .gitignore                                                    
                                                  .lintstagedrc                .lintstagedrc                                                 
                                                  .npmrc                       .npmrc                                                        
                                                  .nvmrc                       .nvmrc                                                        
                                                  .prettierignore              .prettierignore                                               
                                                  .prettierrc                  .prettierrc                                                   
                                                  CLAUDE.md                    CLAUDE.md                                                     
                                                  CODE_OF_CONDUCT.md           CODE_OF_CONDUCT.md                                            
                                                  CONTRIBUTING.md              CONTRIBUTING.md                                               
                                                  LICENSE                      LICENSE                                                       
                                                  README.md                    README.md                                                     
                                                  SECURITY.md                  SECURITY.md                                                   
                                                  eslint.config.mjs            eslint.config.mjs                                             
                                                  package.json                 package.json                                                  
                                                  pnpm-lock.yaml               pnpm-lock.yaml                                                
                                                  pnpm-workspace.yaml          pnpm-workspace.yaml                                           
                                                  renovate.json                renovate.json                                                 
                                                  tsconfig.build.json          tsconfig.build.json                                           
                                                  tsconfig.json                tsconfig.json                                                 
                                                  vite.config.ts               vite.config.ts                                                
                                                  vitest.setup.ts              vitest.setup.ts                                               
                                            View all files           
                                          

                                              Repository files navigation

                                                * 
                                                * README
                                                * Code of conduct
                                                * Contributing
                                                * MIT license
                                                * Security
                                                More items

                                                Build Accessible React Apps with Speed ⚡️



                                              Chakra UI is a component system for building products with speed. Accessible React components for building high-quality web apps and design systems. Works with Next.js RSC

                                                Documentation

                                              It's the https://chakra-ui.com website for the latest version of Chakra UI.

                                                * Latest: https://chakra-ui.com
                                                * v2: https://v2.chakra-ui.com
                                                * v1: https://v1.chakra-ui.com
                                                * v0: https://v0.chakra-ui.com

                                                Installation

                                              To use Chakra UI components, all you need to do is install the @chakra-ui/react package and its peer dependencies:

                                                # with Yarn
                                                $ yarn add @chakra-ui/react @emotion/react
                                                
                                                 # with npm
                                                $ npm i @chakra-ui/react @emotion/react
                                                
                                                 # with pnpm
                                                $ pnpm add @chakra-ui/react @emotion/react
                                                
                                                 # with Bun
                                                $ bun add @chakra-ui/react @emotion/react

                                                Usage

                                              Read the docs here: https://www.chakra-ui.com/docs/get-started/installation

                                                Contributing

                                              Read the contribution guide here: https://www.chakra-ui.com/docs/get-started/contributing

                                                Support Chakra UI

                                                Organizations

                                              Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]

                                                Individuals

                                              By donating $5 or more you can support the ongoing development of this project. We'll appreciate some support. Thank you to all our supporters! 🙏 [Contribute]

                                                Testimonials

                                              People throw React component libraries and design systems at me regularly. This might be the best one I've seen. The APIs are simple but composable and the accessibility on the couple components I looked is complete.

                                              Great work @thesegunadebayo, really inspiring work. – Ryan Florence

                                              Awesome new open-source component library from @thesegunadebayo. Really impressive stuff! – Colm Tuite

                                              This is incredible work. Amazing job Segun! – Lee Robinson

                                              Chakra UI is glorious! I love the consistent use of focus styling and the subtle animation – Guillermo ▲

                                                Awards and Mentions

                                              We've been extremely humbled to receive awards and mentions from the community for all the innovation and reach Chakra UI brings to the JavaScript ecosystem.

                                                  Solution Worth Pursuing                         
                                                                                                  
                                                Technology Radar (2020–2021)                      
                                                                                                  
                                                  The Most Impactful Contribution to the community
                                                                                                  
                                                Open Source Awards (2020)                         
                                                                                                  
                                              

                                                License

                                              MIT © Segun Adebayo

                                        About

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

                                          chakra-ui.com

                                        Topics

                                          a11yaccessibleark-uichakra-uicomponentcss-in-jsdark-modedesign-systemreactreact-componentsreactjsstyledui-componentsui-libraryuikitwai-aria

                                        Resources

                                          Readme
                                          MIT license

                                        Code of conduct

                                          Code of conduct

                                        Contributing

                                          Contributing

                                        Security policy

                                          Security policy
                                          Activity
                                          Custom properties

                                        Stars

                                          40.6k stars

                                        Watchers

                                          197 watching

                                        Forks

                                          3.6k forks
                                          Report repository

                                        Releases

                                        Sponsor this project

                                        Used by

                                        Contributors

                                        Languages

    Footer

        © 2026 GitHub, Inc.

      Footer navigation

        * Terms
        * Privacy
        * Security
        * Status
        * Community
        * Docs
        * Contact
        * Manage cookies
        * Do not share my personal information
      You can’t perform that action at this time.