Install the package

You can use most components and hooks by installing @yamada-ui/react.

Execute one of the following commands in your terminal.

pnpm add @yamada-ui/react

If you want to use tables, calendars, carousels, etc., you need to install them separately.

pnpm add @yamada-ui/table

Add UIProvider

After installing Yamada UI, add UIProvider to the root of your application.

import { UIProvider } from "@yamada-ui/react"

const App = () => {
  return (
    <UIProvider>
      <YourApplication />
    </UIProvider>
  )
}

Use components

Once you've added UIProvider, call the components within your application.

import { Button } from "@yamada-ui/react"

const Demo = () => {
  return <Button>Click me!</Button>
}

With this, the setup for Yamada UI is complete!

Start learning

Why not learn the basics and themes to get to know Yamada UI? 😎