Using Bamboo Studio

Document your design system visually using Bamboo Studio.

Bamboo Studio

Bamboo Studio is a visual interface for exploring and understanding your entire design system. It provides a read-only view of your tokens, semantic tokens, recipes, patterns, conditions, and more.

Bamboo Studio UI

If you don't want to manually generate spec files or build a documentation website, Bamboo Studio is the easiest option.

Studio does not require you to run pnpm bamboo spec.
Studio generates and visualizes your design system automatically.
Studio acts as a fully-featured documentation tool without writing any documentation code.

💡

Spec files are primarily for custom documentation setups and Storybook integrations. Bamboo Studio is for teams who want instant documentation.

Bamboo Studio Setup

To use bamboo studio, first install it:

pnpm i @bamboocss/studio

Next, launch it locally using:

pnpm bamboo studio

This starts a local server and launches an interactive dashboard showing all your design system elements. Since Studio reads your theme configuration directly, any changes to your bamboo.config.ts will appear automatically the next time you run it.

You can also deploy the studio as a standalone design system portal for your team.