This package has been deprecated

Author message:

@chakra-ui/core is no longer supported! Please use @chakra-ui/react instead. See our migration docs (https://chakra-ui.com/docs/migration) for more information.

@chakra-ui/core
TypeScript icon, indicating that this package has built-in type declarations

0.8.0 • Public • Published

Welcome to Chakra UI ⚡️

All Contributors

  • Works out of the box. Chakra UI contains a set of polished React components that work out of the box.

  • Flexible & composable. Chakra UI components are built on top of a React UI Primitive for endless composability.

  • Accessible. Chakra UI components follows the WAI-ARIA guidelines specifications.

  • Dark Mode 😍: All components are dark mode compatible.

Looking for the documentation?

https://chakra-ui.com

Installing Chakra UI

⚡️Chakra UI is made up of multiple components and tools which you can import one by one. All you need to do is install the @chakra-ui/core package:

$ yarn add @chakra-ui/core
# or
$ npm install --save @chakra-ui/core

Getting set up

To start using the components, please follow these steps:

  1. Wrap your application in a ThemeProvider provided by @chakra-ui/core
import { ThemeProvider, ColorModeProvider } from "@chakra-ui/core";

const App = ({ children }) => (
  <ThemeProvider>
    <ColorModeProvider>{children}</ColorModeProvider>
  </ThemeProvider>
);

ColorModeProvider is a context that provides light mode and dark mode values to the components. It also comes with a function to toggle between light/dark mode.

  1. Now you can start using components like so!:
import { Button } from "@chakra-ui/core";

const App = () => <Button>I just consumed some ⚡️Chakra!</Button>;

Contributing

Feel like contributing? That's awesome! We have a contributing guide to help guide you.

The components to be built come from the Aria Practices Design Patterns and Widgets.

Contributors

Thanks goes to these wonderful people (emoji key):

Segun Adebayo
Segun Adebayo

💻 🚧 📖 💡 🎨
Tioluwani Kolawole
Tioluwani Kolawole

📖 💡 🚧

This project follows the all-contributors specification. Contributions of any kind welcome!

Dependents (133)

Package Sidebar

Install

npm i @chakra-ui/core

Weekly Downloads

3,119

Version

0.8.0

License

MIT

Unpacked Size

890 kB

Total Files

368

Last publish

Collaborators

  • segunadebayo
  • _codebender828