Over the past few months I've been exploring a simple idea.
AI has become remarkably good at generating HTML.
Not just acceptable HTML, but genuinely beautiful, well-structured landing pages that would have taken me hours to build by hand. I've found myself reaching for ChatGPT to design pages more often than traditional page builders.
The problem isn't the HTML.
The problem is everything that comes after.
A website isn't a collection of HTML files. It's something that evolves. Clients need to edit copy without breaking layouts. Designers need consistency across dozens of pages. Businesses need drafts, approvals, publishing workflows, and a place where the site can live long after the AI conversation has ended.
Most AI website tools still treat every page like a disposable artifact. You prompt, you get HTML, you copy-paste it somewhere, and hope it still looks right tomorrow.
That works for a one-off demo.
It falls apart the moment you want a real website.
I've been experimenting with what feels like a middle way.
Instead of trying to force AI into WordPress blocks, or abandoning WordPress entirely for AI website builders, what if AI simply became the designer while WordPress remained the system responsible for managing the site?
That's the direction that led me to Vibe Design System.
The idea
AI is great at designing websites.
WordPress is great at managing them.
Instead of generating isolated HTML files, an AI agent should be able to understand an entire website: a shared design language, individual pages, drafts, previews, publishing, and ongoing updates.
I'm building a WordPress plugin that makes that possible.
What it does
At the centre is a simple but powerful action: deploy_vibe_page.
An AI (or any integration) sends a page title, HTML, CSS, and a design system reference. The plugin validates the content, stores it correctly, and creates or updates a WordPress page.
Behind that one action are two important ideas.
Design systems
A design system isn't just a CSS file. It's the shared foundation of a website.
It stores:
- global styles
- colours, typography, and spacing
- version history
- the relationship between every page and the system it belongs to
When an AI updates the look of a production website, it updates the design system, not just one page in isolation.
Two CSS strategies
Not every project starts as a production website, so the plugin supports two deployment modes.
Global (default)
For real websites. CSS lives in the design system and is loaded automatically. Pages contain HTML only.
Inline
For rapid prototyping. CSS is stored with the page so the AI can iterate quickly without affecting the rest of the site.
The deployment flow stays the same. Only the stage of the project changes.
Why validation matters
Letting AI push HTML directly into WordPress without guardrails would be reckless.
Every deployment is validated before it's stored.
- No JavaScript
- No script tags or inline event handlers
- No iframes or embeds
- Images require alt text
- HTML must have a single root wrapper
- CSS must be safe and valid
Pages are created as drafts by default. Publishing requires an explicit opt-in.
The goal isn't to limit creativity.
It's to make AI-generated websites safe, accessible, and maintainable by default.
Why WordPress?
WordPress already solves the hard parts of running a website.
- User roles and permissions
- Drafts and previews
- Publishing workflows
- A mature admin interface
- Extensibility
AI is becoming incredibly good at layout, copy, and visual design.
WordPress is already excellent at ownership, governance, and deployment.
Vibe Design System sits between them.
Not as a replacement for either, but as a bridge.
Built for more than MCP
The first integration surface is the WordPress Abilities API, allowing tools like the WordPress MCP Adapter to call deploy_vibe_page directly.
But the architecture is deliberately independent of MCP.
The core deployment logic lives in a dedicated service that can be reused by REST endpoints, CLI commands, future AI integrations, or whatever comes next.
The destination isn't "AI talks to WordPress."
It's "AI helps maintain a WordPress website over time."
Where this is going
I'm starting with the essentials.
- Design system storage
- Validated page deployment
- Global and inline CSS strategies
- A lightweight admin interface
From there the roadmap opens up.
REST APIs. Design token synchronisation. Rollbacks. Block theme integration. Richer tooling for agents that don't just generate pages, but evolve websites.
Zooming out
I don't think the future is AI website builders replacing content management systems.
I think the future is AI becoming the best designer we've ever had, while WordPress continues doing what it already does brilliantly: managing websites.
The web doesn't need more orphaned HTML files.
It needs a way for AI to participate in real website workflows with structure, safety, consistency, and a CMS that outlives any single prompt.
That's what Vibe Design System is for.
Design with AI.
Deploy to WordPress.
Manage like a real website.
Leave a Reply