Brand Studio

Brand Studio turns business facts and visitor purpose into a durable brand contract, then applies that contract across websites and other creative artifacts.

Live docs · Component catalogue · Examples · npm package

It combines a design workflow, an optional accessible React UI package and public examples in one workspace. The system preserves a brand's positioning, voice, typography, colour logic, imagery and signature devices without forcing every output into one visual template or package.

Products

Product	Location	Current status
Brand Studio UI	packages/ui	113 typed React components for apps, AI agents, effects, story pages and product pages
Brand Studio plugin	plugins/brand-studio	Brand Studio skills (brand-design, take-apart, check-visual, post-video, aesthetic-websites) with Codex and Claude manifests
Showcase	apps/showcase	Interactive component library and completed brand studies
Docs	apps/docs	Public component docs: live previews in any demo brand, props and copyable code
Public examples	examples	Curated standalone proofs, currently focused on authored motion

Install the published @brand-studio/ui package with npm, pnpm, Yarn or Bun. Browse the component documentation.

Run

Requires Node.js 22.12 or newer and npm.

npm install
npm run dev

Open the local URL printed by Vite.

npm run check:brand
npm test
npm run build
npm run typecheck

License

Source code is MIT. Third-party assets keep their own terms; see the PROVENANCE.md file next to each.