pnpm workspace for Sanity’s design-system packages and related apps.
Published packages live under packages/. Docs, Storybook and the legacy docs
Studio live under apps/.
| Package | Description |
|---|---|
@sanity/ui |
React component library |
figma-plugin-sanity-ui |
Figma plugin for Sanity UI theme tokens |
The @sanity/color palette, the @sanity/icons icon components and the
@sanity/logos Sanity / GROQ logo components are installed from npm. Their
Storybooks (color.sanity.dev,
icons-storybook.sanity.dev and
logos.sanity.dev) are composed into this repo's
Storybook.
See the @sanity/ui migration guides when you upgrade from v2 to v3 or from v3 to v4.
| App | Description |
|---|---|
apps/storybook |
Component Storybook (localhost:6006 via pnpm dev) |
apps/docs |
sanity.io/ui docs site (fully static Next.js) |
apps/studio |
Sanity Studio for the legacy docs dataset |
apps/studio is tied to an older deployment of apps/docs that rendered the
previous docs site. Once sanity.io/ui points
elsewhere, both apps can be deleted.
- Node.js
>=22.13 - pnpm
12(pinned viapackageManagerinpackage.json)
pnpm install
pnpm build
pnpm testpnpm dev # Storybook at http://localhost:6006
pnpm dev:docs # Docs at http://localhost:3000/ui
pnpm dev:studio # Sanity Studio at http://localhost:3333In the monorepo, @sanity/ui resolves to TypeScript source through package
exports, so Storybook and the apps hot-reload package edits without a
rebuild.
| Script | What it does |
|---|---|
pnpm build |
Build @sanity/ui and the Figma plugin |
pnpm test |
Unit tests (@sanity/ui) |
pnpm test:browser |
Storybook browser tests (Chromium via Playwright) |
pnpm lint |
Lint + type-check (oxlint) |
pnpm format |
Format with oxfmt |
pnpm knip |
Unused files / dependencies / exports |
pnpm changeset |
Add a changeset for a release |
See CONTRIBUTING.md. Releases use
Changesets: add a changeset on your
PR; merging to main opens a “Version Packages” PR that publishes to npm when
merged.
MIT — see LICENSE.