Quickstart

Before you start

You need an HTFlow account and a way to pay for AI. HTFlow does not sell AI credit, so bring one of:

• An OpenRouter API key, for the builder's own agent panel.
• A ChatGPT or Claude subscription, if you would rather drive HTFlow over MCP from a client you already use.

This page uses the first route. For the second, read the MCP server instead — the rest of the flow is identical.

Build the page

1. Create a Webflow site
   From your workspace, choose New site. HTFlow creates a Flow site with a blank Home page. A Flow site holds raw HTML, CSS and JavaScript — it is the thing that converts to Webflow.
2. Add your OpenRouter key
   Open Settings → AI Keys and paste the key. Usage is billed by OpenRouter at OpenRouter's price; nothing is resold through HTFlow.
3. Describe the page
   In the agent panel, say what the page is for in a sentence or two. You do not need to specify breakpoints, class naming or structure — the rulebook covers those and the agent is held to it.
4. Refine on the canvas
   Select anything and edit it directly, or ask the agent for the change in another sentence. Check the three narrower viewports before you export.

Move it into Webflow

1. Press Copy to Webflow
   HTFlow converts the page and puts the Webflow clipboard payload on your clipboard.
2. Paste into the Designer
   Open a Webflow project, click on the canvas and paste. Headings, paragraphs, links, buttons, images and form labels arrive as native Webflow elements carrying their own classes.
3. Carry on in Webflow
   From here it is an ordinary Webflow project: turn what you reuse into Components, connect CMS collections, hand it to a client.

What to read next

The Webflow rulebook explains what the agent may and may not write, and why a write is sometimes rejected. Into Webflow covers what converts natively and what does not.