Installation
Blok ships as a single npm package — @useblok/core.
Install
pnpm
pnpm add @useblok/corePeer dependencies
Blok expects React 18.2+ or React 19 and the matching react-dom. It is
fully compatible with Next.js App Router and Pages Router. React Server
Components are supported — Blok itself is a client component, but you can
import it from a Server Component without marking the importer as "use client".
Import the stylesheet
Include the editor stylesheet once, globally. Any top-level layout file
works — for Next.js App Router, this is app/layout.tsx.
import "@useblok/core/styles.css";Blok’s stylesheet is scoped and uses CSS variables. It will not leak layout rules onto the rest of your app.
Optional: the SDK
@useblok/sdk provides ready-made storage, versioning, comments, audit, and
presence bindings that work with any BlokStorageAdapter (memory, IndexedDB,
Supabase, REST, Prisma, etc.).
pnpm add @useblok/sdkYou don’t need the SDK to use Blok — you can pass your own callbacks and bindings. See Real-time bindings for what that looks like.
Next
- Quickstart → — Build your first page in 5 minutes.
- Core concepts → — How config, data, and renderers fit together.