open source · MIT license

Build Webflow pages.
Programmatically.

Claude generates structured BuildPlan JSON. Plinth queues it in your Webflow CMS. Your Designer Extension builds it — section by section, without a single fragile API call.

scroll

Why Plinth

Direct MCP→Designer connections are fragile. Tabs lose focus. Calls time out. Webflow's live API doesn't tolerate interruptions mid-build.

Plinth decouples generation from execution. Claude describes a section as JSON. The queue persists it. The extension builds it — reliably, on its own schedule.

Three steps. Zero fragility.

01

🤖

Claude generates a BuildPlan

You describe a page section in natural language. Claude generates a structured BuildPlan JSON — element tree, styles, CSS properties — all validated against a strict schema.

02

📬

Queued in Webflow CMS

The MCP relay server writes the plan to a _Build Queue CMS collection. It persists safely until the Designer Extension is ready to process it.

03

🏗️

Extension builds it

The Designer Extension polls the queue, picks up pending plans, and materializes every element — styles, hierarchy, attributes — directly onto the Webflow canvas.

One section. One JSON document.

hero-section.json BuildPlan v1.0

        

Up and running in minutes.

STEP 01

Install the CLI

npm install -g plinth

Installs the plinth command globally. Requires Node 18+.

STEP 02

Initialise your project

cd my-webflow-project
plinth init

Prompts for your Webflow API token, discovers your site, creates the _Build Queue CMS collection, and registers the MCP server with Claude Code.

STEP 03

Start the relay server

plinth server

Starts the HTTP relay on localhost:3847. Claude Code's MCP tools route through here to your Webflow site.

STEP 04

Install the Designer Extension

cd extension && npm run dev

Run the extension dev server, then register it in Webflow Dashboard → Workspace Settings → Apps & Integrations → Develop. Open your site in Designer and start building.