Frontfriend SDK
@frontfriend/sdk includes the frontfriend CLI, runtime helpers, Next.js and Vite integrations, and the MCP bridge. Use it for design contracts alone or adopt tokens and components too. A package version, a component version and a Design System Release are separate selections.
Tokens are protected by a verified local copy during Studio outages. Private components and other authenticated operations still need Studio. Native shadcn import is available: keep the native base, or convert explicitly to Frontfriend later.
Frontfriend connects your brand, design rules and native components to the context agents need to work on your product. Build different design systems from the same components, across React and Vue.
Your brand
Start with Brand Import and refine your foundations in Theme Studio. Semantic tokens connect color, typography and component styling across your applications.
Your rules
Design rules explain how your brand looks, behaves and speaks. Organize them by chapter, add scope and rationale, and share relevant requirements and guidance with agents through MCP.
Your stack
The catalogue covers 88 components across Base UI, Radix UI, React Aria and Vue with Reka UI. Select an explicit primitive target and keep component source in your repository.
Your agents
MCP supplies design rules and component knowledge. Design Skills guide setup, design, import and audit workflows. Design contracts carry product intent into the next iteration.
Your team
A Workspace owns access, a Design System owns shared decisions, and an Application chooses its target and installed components. Read Plans and access and Versions & releases to understand these responsibilities.
Get started
Follow Installation to connect your application, or Adopt Frontfriend for a shadcn project.