gridland
Getting Started

Installation

Scaffold a new Gridland project or add Gridland to an existing app

Gridland renders terminal-style UIs directly to an HTML5 Canvas using React. Built on the opentui engine. No xterm.js, no terminal emulator, just a React reconciler, Yoga layout, and canvas pixels.

Start a new project

Scaffold a new Gridland app with everything pre-configured bundler, shadcn registry, themes, and example components. You can then add components with a single command:

Terminal
bunx create-gridland my-app
cd my-app
bunx create-gridland add spinner
Terminal
npx create-gridland my-app
cd my-app
npx create-gridland add spinner
Terminal
yarn create gridland my-app
cd my-app
yarn dlx create-gridland add spinner
Terminal
pnpm create gridland my-app
cd my-app
pnpm dlx create-gridland add spinner

create-gridland add detects your package manager and proxies to shadcn under the hood scaffolded projects already have components.json wired up so it just works.

Add to an existing project

If you already have a React app, pick your bundler:

Install components

Gridland UI components are distributed via a shadcn registry components are copied into your project so you own the code and can customize them freely. Scaffolded projects have shadcn pre-configured, so you can add components right away:

Terminal
bunx create-gridland add spinner

For the full list of components, shared utilities, and the components.json setup for non-scaffolded projects, see Manual Installation → Install components.

Packages