Getting started

Installation

Blocks are copied into your repository rather than installed as a dependency. Once a block is in your project, it is your code — edit it, rename it, delete half of it.

Chakra UI v3 required
Blocks rely on v3 token semantics. On v2, migrate first — the Chakra team publishes a codemod.

Before you begin

The CLI writes files into your project and reads your existing configuration, so it expects a few things to already be true:

  • A Next.js app using the App Router, on Node 20 or newer.
  • A configured @/ path alias in tsconfig.json.
  • Chakra UI v3 with a provider mounted at the root of the tree.

What gets written

Each block lands as a single file under src/blocks/, with no shared runtime and no wrapper components. Nothing outside that directory is touched unless a block declares a dependency, in which case the CLI asks before installing it.