Frappe UI React

Getting Started with React

This guide will help you set up your application and get started with the basic components.

Installation

Create Project

Run the init command to create a new Next.js project or to setup an existing one:

npx shadcn@latest init

You can use the -d flag for defaults (New York style, Zinc color, and CSS variables):

npx shadcn@latest init -d

Configure components.json

You will be asked a few questions to configure components.json:

  • Which style would you like to use? › New York
  • Which color would you like to use as base color? › Zinc
  • Do you want to use CSS variables for colors? › no / yes

Adding Components

Once configured, you can start adding components to your project:

npx shadcn@latest add "https://frappe-ui-react.tmls.dev/registry/button"

You can then import and use components like this:

Open in

For more examples and usage details, check out the Button documentation.