An AI-native page builder
for WordPress
Tuli is AI-native, not AI bolted on: build with AI, write the code yourself, or drag it out visually — whatever works for you, and switch between all three mid-page because they all write to the same source of truth. Paste in any HTML, CSS & JavaScript, even a whole vibe-coded website, and every tag becomes an editable element. What ships is standard, portable code with nothing hidden.
With AI
Describe what you want and Tuli builds it — pages, sections, templates, forms, custom post types, PHP snippets, whole plugins. The AI edits the same HTML and CSS you do, so everything it writes is yours to change afterwards.
With code
Write or paste real HTML, CSS, JavaScript and PHP. Type a property by hand and the visual controls update to match. There is no proprietary format in between, and no generated markup you cannot read.
Visually
Click any element and shape it with spacing, typography, colour, flex and grid controls. Every drag writes a real CSS declaration into your real stylesheet, on the same frame, with no hidden layer.
A WordPress agent, not just a page generator
Don’t start from a blank page. Tuli’s AI assistant is a full WordPress agent — it builds and edits, and it reaches the rest of your site too. Run it from your dashboard (Tuli → AI Assistant) or inside the builder — identical capabilities in both.
- Build pages, sections and templates from a prompt
- Rewrite and restyle existing content in place
- Write straight into your real HTML and CSS
- Create forms, custom post types and ACF fields
- Install and configure plugins from WordPress.org
- Add custom PHP as Code Snippets, or a whole plugin
- Run WP-CLI commands and upload media
- Load expert skills: design, SEO, AEO, accessibility
- Match the design system your site already uses
- Check its own work in a headless browser
- Keep working after you close the browser
- Run on licence credits, or your own AI account
- Same tool set as the MCP server, so you can swap between them
Prefer your own AI coding agent? Use the MCP server
Rather drive your site from the AI tool you already pay for? Turn on the MCP server and connect Claude Code — or any agent that speaks the Model Context Protocol — and it gets exactly the same tool set.
- Connect Claude Code, or any agent that speaks MCP
- Get the same tool set as the built-in assistant
- Build posts, pages, templates and full Tuli layouts
- Install plugins, upload media, register post types
- Authenticate with application passwords you control
- Limit it to the actions you allow, revoke any time
- Keep your theme locked — it can never be switched
Convert any HTML to WordPress, instantly editable
This is the one thing Tuli is built around. Drop in any HTML, CSS & JavaScript — even an entire vibe-coded website — and Tuli instantly turns every tag into an editable page builder element on a real WordPress page. Every part round-trips perfectly, ready to edit visually.
- Section comments are preserved, not folded into the next rule
- Compound selectors like
.btn:hoverand.card .iconstay exact - Shorthands decompose cleanly when you edit one side
-
@mediablocks keep their breakpoints and grouping
/* ===== Buttons ===== */
.btn {
padding: .75rem 1.5rem;
border-radius: 12px;
}
.btn:hover {
background: #4b46e0;
}
@media (max-width: 599px) {
.btn { width: 100% }
}The inspector, end to end
Click any element and shape it without touching code — or type CSS directly. Edits sync two ways and your output stays clean, with duplicate selectors auto-merged into one rule.
Spacing controls
Per-side padding and margin with smart snap-back protection — your value never jumps while you type.
Typography
Font family, size, weight, line-height, letter-spacing and alignment — all live, all standard CSS.
Color & background
Pick colors, gradients and backgrounds with a clean picker that maps straight to real declarations.
Layout & flex/grid
Toggle display, direction, alignment, gap and wrapping with icon toggles instead of guesswork.
Two-way CSS sync
Type CSS by hand and the visual controls update; click the controls and the CSS updates — both stay in lockstep with the live canvas, and duplicate selectors auto-merge.
One-click clear
A green dot beside any property clears it instantly — from the element and every related variant at once.
Everything you need to assemble a page
Elements library
Sections, containers, columns, buttons, headings, text, images, code blocks, shortcodes and more — drag or click to add.
Structure tree
A live outline of the page DOM. Reorder, nest, rename and select — newly inserted nodes auto-expand the first time.
Query loops
Enable a loop on any element and it clones per result. Drive it from the Main Query, a visual WP_Query, raw PHP or an ACF repeater. Style the template once; every result matches.
Reusable templates
Headers, footers, single, archive, 404 and search layouts plus reusable sections, shown wherever your include and exclude display conditions say.
PHP & shortcodes
Type raw PHP or any shortcode; it's pre-rendered server-side so the canvas shows real output, not raw tags.
Dynamic data tokens
Insert post fields and any ACF field from a searchable picker — click to insert — or print any WordPress/custom function by typing {function_name}. Resolved live from WordPress.
Built-in form builder
Paste any HTML form or build one visually. Server-side validation, spam protection, stored entries and email, webhook or custom actions are all built in, with no form plugin.
AJAX filters
Add built-in AJAX filters to any query loop for instant, no-reload faceting. WP Grid Builder is supported too.
30+ WooCommerce blocks
Compose custom product, archive, cart and account pages from 30+ WooCommerce building blocks — title, price, add-to-cart, gallery, grids and more.
Popups, built in
A Popup element you fill with any content and style like any other section. Open it on page load after a delay, on exit intent, or from any button you pick. Close on Escape, backdrop click or the built-in close button, and show it just once per visitor.
Menus, headers & sticky nav
A responsive nav element with a hamburger toggle, dropdown submenus and its own colour and spacing controls, plus a Header element that sticks on scroll with its own offset, background, text colour and shadow.
Logins, sign-ups & comments
Login, registration, password-reset and search form elements, plus WordPress comment form and comment list blocks. Real WordPress output, styled visually like everything else on the page.
One move, one tick, everywhere
When you change a value, everything happens on the very same frame — so the canvas updates before your finger lifts.
You change a value
Drag a slider, pick a color, type a number, or click the green dot to clear a property.
The source CSS updates
Tuli writes the change straight into the right place — site-wide rules to your Global CSS, page-specific #id rules to Page CSS.
The canvas repaints
The live preview re-renders synchronously from that same CSS — no lag, no stale value snapping back.
Every surface stays in sync
The Style panel, the Page/Global CSS boxes and the canvas are all bound to one source of truth. Edit any one — the rest follow.
You save when ready
No autosave surprises. Experiment freely; persistence happens only when you click Save.
Tuli ships clean code
On save, your work becomes clean, bloat-free .html and .css files that WordPress serves — fast, cacheable and portable, with no code lock-in.
Rich media and motion, built in
Drop in media and interactive elements and skin them visually — Tuli only loads each element's front-end script on pages that actually use it.
Video element
Upload a file or embed YouTube or Vimeo. A clean, bundled player skins it consistently, with controls you can style.
Audio element
Upload audio and present it through the same bundled player — a tidy, styleable HTML5 audio control.
Slider / carousel
Build slideshows from any content and let them rotate — the slider script loads only when a slider is on the page.
Tabs
Organize content into switchable tabbed panels — fully editable and styled like the rest of your page.
Accordion
Collapsible sections for FAQs and long content — expand, collapse and style each panel visually.
Divider
A simple, configurable separator to give your sections breathing room and visual structure.
SVG & icon elements
Upload an .svg and Tuli inlines it at render time, so an icon costs zero extra requests and inherits currentColor. Uploads are sanitized before they ever touch the disk, and Font Awesome icons get their own element too.
Embeds
Drop in an Embed element for YouTube, Vimeo, Maps, Calendly or any iframe you already have, then size, round and position it with the same controls as everything else.
Scroll animations
Give any element a fade-up, zoom or slide-in with the delay you choose, straight from the inspector. The animation library is only loaded on pages that actually use one.
Consistent by default
Define your brand once and reuse it everywhere. Tuli's theme settings, tokens and fonts keep every page on-brand.
- Design tokens exposed as
:rootCSS custom properties - Google Fonts lazy-loaded directly into the canvas
- A typographic baseline for body, headings and containers
- Live preview of theme settings as you tweak them
:root {
--brand: #6c5ce7;
--accent: #ff7a5c;
--font: "Inter", sans-serif;
--radius: 16px;
}Responsive breakpoints
Edit desktop, tablet (≤ 991px) and mobile (≤ 599px) independently. Tuli wraps your edits in the right @media query automatically, and editing the desktop value never disturbs the responsive ones.
Safe by design
HTML, CSS and JS are sanitized on every save. Capability checks and nonces guard every endpoint. Raw <script> stays opt-in for trusted administrators only — never silently widened.
Take your site with you, as plain HTML
Tuli never holds your site hostage. Even if you decide not to continue with us, you can export the whole thing as a static HTML site and keep it.
Built-in static site export
Open Tuli, then Settings, then Export Site. Tuli crawls your live front end, saves every page as plain HTML, downloads the stylesheets, scripts, images, videos and fonts, rewrites the links and gives you one zip. Unzip it and the folder looks identical to the live site, with no WordPress needed.
Dynamic content included
Pages are captured from the real front end, so blog archives, query loops and category pages are exported exactly as visitors see them. Choose which post types, taxonomies and archives to include, and optionally download external fonts and CDN files for a copy that works fully offline. As with any static export, features that need PHP at request time, such as form submissions, search, login and comments, need a backend.
Everything else you would reach for a plugin to do
Forms, fonts, snippets, site-wide code, speed, SEO and accessibility are built into Tuli, so a typical site needs far fewer plugins.
Forms that work out of the box
Paste any HTML form or use the visual builder. The server re-checks every field against your original markup, stores entries, sends emails and runs your actions. Honeypot, fill-time, per-IP limits, blocked IPs and keywords, link limits and an alphabet allowlist keep spam out.
Custom fonts, self-hosted
Upload .woff2, .woff, .ttf or .otf files and Tuli writes the @font-face CSS for you. Fonts load from your own site with no third-party request, and appear in the builder font picker.
Code snippets manager
Add PHP, HTML, CSS or JavaScript from one screen under Tuli → Code Snippets. Small features get their own titled snippet you can switch off or delete, instead of being buried in functions.php.
Header, body and footer code
Paste analytics, tag manager, verification tags, pixels and chat widgets once under Tuli → Settings and they print on every page in the right place.
Fast by default
Plain static CSS and JS files, one site stylesheet, and runtime scripts, sliders, animations and icon fonts only on pages that use them. Turn on Minify CSS & JS for even smaller files.
SEO and AEO ready
Clean semantic HTML that crawlers read as written, server-rendered loops and dynamic data, full control of alt, title, rel and loading attributes. Ask the AI to audit titles and descriptions, add FAQ sections and JSON-LD schema.
Accessibility you control
Every element is a real tag with attributes you can edit, so alt text, aria labels, landmarks and form labels are yours to set by hand or across the whole site with the AI.
Show or hide by condition
Visibility conditions on any element, plus include and exclude display conditions with priority on every template, so the right content appears for the right visitor and page.
Any post type you like
Switch the builder on for pages, posts, products, landing pages or any custom post type — including ones the AI registers for you — and leave it off everywhere else.
Plays well with your whole stack
Tuli is built for the WordPress ecosystem you already run — WooCommerce, ACF, WP Grid Builder, PHP, shortcodes and built-in AJAX filters, all supported out of the box.
WooCommerce
30+ native building blocks. Assemble custom product, archive, cart and account pages from composable parts.
ACF
Advanced Custom Fields are supported by default — field names appear in the dynamic-data picker, and you can loop ACF repeaters in a query.
WP Grid Builder
Drop in a Facet element and wire WP Grid Builder facets to your query loops for advanced filtering.
Built-in AJAX filters
Add Tuli's own faceted filters — taxonomy, custom field, search and sort — to any query loop, refreshing results over AJAX with no page reload.
Any shortcode
Drop in any plugin's shortcode; it's rendered server-side so the canvas shows the real result.
Raw PHP
Type <?php … ?> blocks; Tuli pre-renders them so dynamic output appears live in the editor.
30+ WooCommerce building blocks
Product parts, loop parts and store-wide parts — each is a tiny, selectable element WooCommerce renders and you style. The WooCommerce group only appears when Woo is active.
Single-product parts
Loop, page & global parts
Built for momentum
Undo & redo
Debounced snapshots of HTML and CSS let you experiment and roll back instantly.
Copy & paste blocks
Copy any styled section as a self-contained snippet and paste it anywhere — its styles travel with it.
Explicit save
No surprise autosaves. Experiment freely with values; nothing persists until you click Save.
No script bloat
Tuli loads front-end scripts only for the elements you actually use — sliders, tabs and the rest stay off the page until they're needed.
Edit with Tuli from anywhere
An Edit with Tuli button sits in the block-editor toolbar, the admin bar and your pages list, so you drop straight into the builder from wherever you already are.
Updates in place
New versions appear in WordPress’ own Updates screen and install with one click, verified against your licence — no zip to re-upload, no FTP.
See it for yourself
The fastest way to understand Tuli is to paste a page in and start editing.