Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/chakra-ui/chakra-ui
Chakra UI is a component system for building products with speed ⚡️
https://github.com/chakra-ui/chakra-ui
a11y accessible ark-ui chakra-ui component css-in-js dark-mode design-system react react-components reactjs styled ui-components ui-library uikit wai-aria
Last synced: 2 days ago
JSON representation
Chakra UI is a component system for building products with speed ⚡️
- Host: GitHub
- URL: https://github.com/chakra-ui/chakra-ui
- Owner: chakra-ui
- License: mit
- Created: 2019-08-17T14:27:54.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2025-02-05T10:06:18.000Z (7 days ago)
- Last Synced: 2025-02-05T11:20:17.827Z (7 days ago)
- Topics: a11y, accessible, ark-ui, chakra-ui, component, css-in-js, dark-mode, design-system, react, react-components, reactjs, styled, ui-components, ui-library, uikit, wai-aria
- Language: TypeScript
- Homepage: https://chakra-ui.com
- Size: 158 MB
- Stars: 38,427
- Watchers: 202
- Forks: 3,347
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-chakra-ui - https://github.com/chakra-ui/chakra-ui
- awesome - chakra-ui/chakra-ui - ⚡️ Simple, Modular & Accessible UI Components for your React Applications (MDX)
- awesome - chakra-ui - ⚡️Simple, Modular & Accessible UI Components for your React Applications (JavaScript)
- awesomeLibrary - chakra-ui - ⚡️ Simple, Modular & Accessible UI Components for your React Applications (语言资源库 / typescript)
- awesome-react-components - chakra-ui - [demo/docs](https://chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications. (UI Frameworks / Responsive)
- awesome-react - chakra-ui - Simple, Modular & Accessible UI Components for your React Applications. ![](https://img.shields.io/github/stars/chakra-ui/chakra-ui.svg?style=social&label=Star) (UI Frameworks / style)
- awesome-trevor - ChakraUI - Simple, Modular & Accessible UI Components for your React Applications (Programming / JavaScript)
- awesome-luooooob - chakra-ui/chakra-ui - ⚡️ Simple, Modular & Accessible UI Components for your React Applications (MDX)
- awesome-starts - chakra-ui/chakra-ui - ⚡️ Simple, Modular & Accessible UI Components for your React Applications (TypeScript)
- awesome-react-components - chakra-ui - [demo/docs](https://chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications. (UI Frameworks / Responsive)
- react-cheatsheet - Chakra UI
- awesome-list - chakra-ui - ui | 20014 | (TypeScript)
- awesome-react-components - chakra-ui - [demo/docs](https://chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications. (UI Frameworks / Responsive)
- best-of-react - GitHub - 7% open · ⏱️ 05.06.2024): (UI Frameworks & Libraries)
- fucking-awesome-react-components - chakra-ui - 🌎 [demo/docs](chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications. (UI Frameworks / Responsive)
- StarryDivineSky - chakra-ui/chakra-ui
- awesome - chakra-ui
- Awesome-NextJs - chakra-ui - [website](https://chakra-ui.com/) (Build with Nextjs)
- awesome-react-hooks - chakra-ui - ⚡️ Simple, Modular & Accessible UI Components for your React Applications (Packages)
- awesome-personal - Chakra UI - Simple & Bubbly Component Library (React / Component Libraries)
- awesome-ccamel - chakra-ui/chakra-ui - Chakra UI is a component system for building products with speed ⚡️ (TypeScript)
- stars - chakra-ui - ui | 38488 | (TypeScript)
- awesome-react - Chakra-ui - 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.. (Uncategorized / Uncategorized)
- awesome-react - Chakra-ui - 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.. (Uncategorized / Uncategorized)
- awesome-react-components - chakra-ui - [demo/docs](https://chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications. (UI Frameworks / Responsive)
- awesome-react-components - chakra-ui - [demo/docs](https://chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications. (UI Frameworks / Responsive)
- stars - chakra-ui - ui | 38399 | (TypeScript)
README
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:```sh
# 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](https://opencollective.com/chakra-ui/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](https://opencollective.com/chakra-ui/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](https://twitter.com/ryanflorence/status/1169260008069947392)> Awesome new open-source component library from @thesegunadebayo. Really
> impressive stuff! –
> [Colm Tuite](https://twitter.com/colmtuite/status/1169622886052782081)> This is incredible work. Amazing job Segun! –
> [Lee Robinson](https://twitter.com/leeerob/status/1169330130361159682)> Chakra UI is glorious! I love the consistent use of focus styling and the
> subtle animation –
> [Guillermo ▲](https://twitter.com/rauchg/status/1169632334389248000)## 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](https://github.com/segunadebayo)