flowkitStart creating ↗
ONE CANVAS. YOUR CHOICE OF AGENT.

Bring your agent.
Make something together.

A quick setup, then a real conversation. Choose your agent and let Flowkit handle the MCP configuration.

01 / INSTALL ONCE

Start in your project folder.

You’ll need Bun and your preferred agent installed. Run this in a terminal from the folder you want to work in.

bun install -g @combycode/flowkit
Already installed? Continue below.

Claude Code

CLI & editor extension

Connect Flowkit

Run this in your project folder. Claude Code reads the project’s MCP configuration.

flowkit init --client claude-code
CONFIGURATION.mcp.json

Open your agent

Start Claude Code in this folder with the command below, or reopen the folder in your editor and start its Claude Code session.

claude

Start the conversation

Send this message in your agent’s chat. Allow its Flowkit tool calls when prompted, then open the canvas URL it returns.

Open new Flowkit project. Let's design something.
You’re connected when…

Your agent can create a Flowkit project and you can see its canvas in your browser. Keep the conversation going — describe a screen, then refine it together.

Prefer to review the config first?

This command prints the configuration and its destination without changing any files.

flowkit config claude-code
A FEW USEFUL DETAILS

Less setup. More creating.

Where do my designs live?

By default, in the design folder inside the directory where you run init. Choose another folder with --dir.

flowkit init --client claude-code --dir "./my-designs"
Will this replace my other MCP servers?

Flowkit merges its own entry into the existing configuration. Other server entries remain in place. Running init again updates the Flowkit entry.

My agent cannot see Flowkit

Check the config path printed by init, reopen your agent, and confirm the MCP server is enabled. For project-scoped clients, open the same folder where you ran init. Run flowkit --version in your terminal to check the installation.