Sorb documentation

Sorb is the design-token bridge for the running app. Propose a token change, watch your real React components re-skin live, then verify it before you merge. These docs cover the whole loop — from install to the Figma plugin to the hosted account.

• Getting started

  Install the SDK, run the bridge, and connect the Figma plugin to your running app.

• Figma plugin

  Install Sorb (Canopy) in Figma and learn the propose → preview → bind loop.

• Tokens & taxonomy

  How Sorb reads DTCG tokens, resolves them, and binds them to CSS properties by type.

• React SDK (@sorb/leaf)

  Wrap your app in SorbProvider; tokens arrive as CSS custom properties, live-swappable.

• The bridge (sorb dev)

  Run @sorb/juice locally to connect the plugin to your running component over the bridge.

• Cloud & accounts

  Sign up for the public beta, create an org, and connect the plugin with an org key.

• Troubleshooting

  Common connection, preview, and binding issues — and how to resolve them.

Beta status

Sorb is in free public beta. It is not generally available yet — expect rough edges and active iteration. During the beta the local loop (sorb dev + @sorb/leaf) runs entirely on your machine with no account required; a hosted account adds the cloud bridge and org connection.

Verified = checked against your live components’ tier/type bindings before merge — not a visual or accessibility audit.

Works with Figma. Not affiliated with, or endorsed by, Figma. Figma is a trademark of Figma, Inc.