A tour of the workspace
From a blank site to a deployed one — five screens
No slides, no theory. Here's exactly what you click, in order: create a site, paste in the HTML your AI wrote, sync a shared header and footer, add a content collection like a blog, and build the whole thing to a zip or GitHub.
Create a site in one field
Name the site, optionally attach a domain, and HTMLStudio scaffolds the project for you — an index.html is added automatically so there's nothing empty to stare at.
The domain field isn't cosmetic: it's used later to build correct absolute URLs in your sitemap.xml, so you don't have to hand-edit it before launch.
Create site — new project dialog
Paste what the AI already wrote
Every new page opens with a real file tree on the left — assets, index.html, plus header and footer templates — and a code editor on the right, already scaffolded with a starter <head> and a prompt: paste your AI-generated HTML here.
A Visual tab sits right next to Code, so once the markup is in, non-coders can keep working without touching a tag.
index.html — code editor, with project files on the left
Click a block, edit it in place
Switch to the Visual tab and the page renders as it will look live — headings, copy, and images become directly clickable, with a dashed outline marking the editable region and its own edit icon.
Change the words without touching a tag; the underlying HTML — including template placeholders, on a page like this one — stays intact underneath.
Visual editor — click any block to edit it in place
Site-wide CSS lives in exactly one file
Every project gets a global style.css under assets/css. Edit it once and it's automatically injected into every page in the visual editor and available at the same path on the built site.
Paired with the shared header and footer templates, this is what keeps a five-page site — or a folder of six client sites — from drifting out of sync page by page.
style.css — the site-wide stylesheet
Add a collection for anything repeatable
Blog, news, case studies — click Create article collection, name it, and pick which fields each entry needs: title and content by default, plus optional date, excerpt, author, or featured image.
HTMLStudio generates the folder, an article-template.html, an articles-template.html for the index, and wires them together — no CMS, no database.
Create article collection — set the fields once
Placeholder tags do the repeating for you
The generated article-template.html is a normal HTML file — style it however you like — with placeholder tags like <htmlstudio-article-title/>, <htmlstudio-article-content/>, and <htmlstudio-article-date/> marking where each field gets injected.
Design the layout once; every article you add afterwards inherits it automatically, including the automatic <htmlstudio-article-next/> / previous/> links between entries.
article-template.html — one layout, every article uses it
Build to a zip, or push straight to GitHub
When the site is ready, Start build packages the whole project as a downloadable zip — assets are fetched directly in your browser, so it stays light on server usage.
Leave Also push to GitHub checked and the same build lands in your repo, ready for GitHub Pages, Netlify, Vercel, Cloudflare Pages, or any static host you already use.
Building your site — zip export, with an optional GitHub push
-
Nothing hidden
It's still just files
Every project is plain HTML, CSS, and template tags you can read. Export the zip and there's no proprietary format locking you in.
-
Built for more than one site
Every project looks the same
The same explorer, the same style.css pattern, the same collection setup — whether it's one site or six client folders.
-
Your call, at every step
Code or visual, zip or GitHub
Toggle between the code editor and the visual one, and choose zip-only or a GitHub push at build time. Nothing is locked to one path.