The Kirki WordPress builder

Describe it once.WordPress, Kirki-ready.

Describe a site and HTFlow’s agent builds it in real HTML, CSS and JavaScript, then the htflow-for-kirki plugin imports it into your Kirki-powered WordPress site. Faster and far cheaper than asking an AI to drive a page builder directly, and you bring your own AI, so we never bill you for it.

~95%: of the build done by AI
0%: margin taken on AI
3: ways to run it

Build fromWordPressKirkiClaudeChatGPTCursor

01Why HTFlow exists

Building inside a page builder is not the same as building the web.

Page builders need more than the final HTML and CSS. They keep pages as modules, settings and builder-specific data in the database.

A page builder stores its own shape
A WordPress page builder does not keep your page as HTML. It keeps rows, modules and settings in the database, and renders the markup later.
More structure means more context
An AI writing into that has to hold the builder's schema in mind while it is also making design decisions — layout, typography, responsiveness, motion.
Safe layouts are easier to generate reliably
The more constraints a model must satisfy as it writes, the more attractive the predictable, template-shaped answer becomes.
HTFlow separates the two problems
The agent designs in ordinary code first. HTFlow takes responsibility for making that frontend import cleanly into your Kirki-powered WordPress site.

02How it works

Four steps into WordPress. Then it is a Kirki page.

You do not need to know any of the machinery. You describe it, the agent builds it, the plugin imports it, and you finish in WordPress like always.

Describe
Tell the agent what the page is for, in a sentence or two.
Build
It writes HTML, CSS and JavaScript that a WordPress theme can carry as it is.
Refine
Adjust it on the canvas, or ask for changes until it is right.
Import
The htflow-for-kirki plugin brings the page into WordPress, section by section.

And one rulebook keeps the build theme-safe.

The build step is the one that could go wrong, so it is the one that is constrained. The agent writes ordinary code, but only the subset a WordPress theme can carry without a build step.

BEM

block, block__element, block--modifier. Real classes, no collisions with your theme.

Responsive

Desktop, tablet and phone, written as ordinary media queries.

Semantic HTML

Headings, sections, lists and links — markup WordPress and search engines both read.

Zero Dependencies

Vanilla HTML, CSS and JavaScript. No Tailwind, no jQuery, no CDN.

Of the work, before you open WordPress

The heavy lifting is already done.

Once HTFlow has generated the site, the plugin imports it in minutes. Everything below is already done by the agent — the repetitive bulk of the build, finished before you open the WordPress admin.

Page layout and section structure
Responsive styles at every breakpoint
Typography, spacing and hierarchy
Ordinary interactions and states
A first version of the whole multi-page site

What is left for you in WordPress: wire the sections to your dynamic content, swap in your own images, and any minor tweaking.

Start building Install htflow-for-kirki

The same builder also exports to Webflow, or as plain HTML and CSS.

03The builder

Watch a page go from a sentence to your WordPress site.

Try it yourself

The HTFlow builder: a page open on the canvas with the
navigator on the left and the site agent on the right — One plugin, one importSections arrive in WordPress as clean markup and styles, ready for Kirki to control.

A visual canvas

Select anything on the page and change it directly, or ask the agent for the change in a sentence.

A real layer tree

Every element shows up in the navigator with its tag and class, so you always know what you are editing.

Every viewport

Desktop, tablet and phone, checked as you build rather than after the import.

Shared design tokens

Colours and type live in one place, so a change lands everywhere instead of section by section.

Undo and run history

Step back through your own edits and the agent’s. Nothing it does is a one-way door.

Checked before it ships

The agent is held to markup a theme can carry, so the import is not where you find out something broke.

04Three ways in

Use the AI you already use.

You do not have to move to a new assistant, or learn one. Pick whichever of these you are already set up for.

HTFlow’s built-in agent

The builder has its own site-generation agent. Connect an OpenRouter key and it runs on that.

OpenRouterYour own keyAny model

Whatever you use is billed by OpenRouter, at OpenRouter’s price.

ChatGPT or Claude

Already paying for one of them? Connect HTFlow’s MCP server or connector and build the same site from there.

ChatGPTClaudeMCPConnector

Your existing subscription does the work. No second AI bill, no key to manage.

Any MCP client

For people who live in an editor: point any MCP-compatible client at HTFlow’s server and build from your own toolchain.

CursorVS CodeAntigravityKiroKimi CodeZ Code

Plus any other MCP-compatible client you connect.

Set up the MCP connector

05What it costs

You pay your AI provider. Never us.

HTFlow is the platform and the import. The intelligence is yours to bring, and whatever it costs goes straight to whoever provides it.

Your own API keyOn your account, under your control, revocable any time.
Your account
OpenRouter, or the subscription you havePick whichever model you want, or skip keys and drive it from ChatGPT or Claude over MCP.
Billed by your provider
HTFlowThe builder, the rulebook and the WordPress import.
No AI markup

The part that matters: HTFlow does not sell AI credits and takes no margin on AI usage. There is no credit pack to buy first, and nothing is resold through us — whatever the build costs is your provider’s bill, at your provider’s price.

06Before you build

The questions people usually ask.

Looking for plans and limits instead? See pricing

Do I need Kirki already installed?

Yes. HTFlow builds the site and the htflow-for-kirki plugin imports it into a WordPress install that is already running a Kirki-powered theme. The plugin is the bridge, not the theme.

What actually arrives in WordPress?

Ordinary HTML, CSS and JavaScript, section by section. No shortcodes, no proprietary blobs — markup your theme can carry and you can read.

Can I keep editing after the import?

Yes. Once a section is in, it is yours: edit it in WordPress the way you edit anything else, and control what Kirki exposes through its own fields.

Is this the same builder as the Webflow one?

The same builder, a different destination. You describe the site once; the export decides whether it lands in WordPress, in Webflow, or as plain HTML and CSS.

Does HTFlow charge for the AI?

No. You bring your own OpenRouter key, or drive the build from a ChatGPT or Claude subscription you already pay for over MCP. HTFlow takes no margin on AI usage.

Will the CSS fight my theme?

Class names follow BEM, so they are specific to the section rather than generic names a theme is likely to be using. Nothing is loaded from a CDN and there is no framework to reconcile.

Can I build from ChatGPT or Cursor instead?

Yes. HTFlow's MCP server exposes the same tools to any MCP client — ChatGPT, Claude, Cursor, VS Code and others — so the build can happen wherever you already work.

What if I want dynamic content?

Build the section, import it, then wire it to your posts, fields or Kirki settings in WordPress. HTFlow gets the design and the markup right; WordPress stays in charge of the data.

Your next WordPress page is one prompt away.

Start free. Describe a page, refine it, and import it into Kirki.