Getting Started

How to use the Bonsai Design System in your project

Preview

Bonsai UI

v0.1.0

Shared components for Bonsai Software products

Add the registry to your project's components.json:

{
  "registries": {
    "@bonsai": {
      "url": "https://design.bonsai.dev/r"
    }
  }
}

npx shadcn add @bonsai/button @bonsai/card @bonsai/input

Copy the CSS variables from Design Tokens into your project's CSS file.

Design Tokens

CSS custom properties that define the visual language