Free tool · Claude-powered

Liquid HTML: edit your site by pointing and clicking.

A free, drop-in toolkit for editing static websites. Put any page in edit mode, click the thing you want to change and type a note, or edit the words right on the page. Claude reads your marks and edits your real files. No framework, no build step.

  • Works on any plain HTML site
  • Your files, edited in place
  • Open code, nothing hidden
yoursite.com
Edit Mode
Your homepage

We build custom timber furniture.1

Handmade in Melbourne, built to last a lifetime.

Get a quote
<h3> "We build custom timber..."
Make this punchier and mention hand-finished.
Edit Note Save
What it is

A visual layer for editing your site with Claude

Vibe-coding a site is fast until you want a small tweak, and then you are writing a paragraph to explain which element you mean. Liquid HTML flips that. You click the thing, type what you want, and Claude edits the real file.

Point and comment

Turn on Edit Mode, click any element and type what you want. Your note is pinned to that exact spot in the source.

Edit text in place

Switch to Text Edit and change the words right on the page. Plain text writes straight to your file the moment you click away.

Claude does the work

Hit Send to Claude and say "apply the queue." Claude edits your real files and leaves your links and layout untouched.

Any static site

Point it at any folder of HTML and CSS. No React, no build step, nothing to add to your pages by hand.

Check every breakpoint

The View button opens a responsive preview, so you can mark up mobile, tablet and desktop separately.

Site memory

Keep standing design notes and a bug log that Claude reads before every change, so the same fixes never come back.

How it works with Claude

Mark it up. Claude builds it.

You click and comment. Claude edits the files. Your site updates. No describing which button you meant.

You
Apply the edit queue.
Done. Updated 3 elements across index.html and pricing.html, and cleared the queue.
You
The hero heading still feels long. Shorten it.
Trimmed it to Custom timber, built to last. Take a look and mark it up again if you want another pass.
1

Point it at your site

Run the little toolkit against your project folder. It serves your site with the editor already loaded.

2

Mark it up

Click any element to leave a note, or switch to Text Edit and change the words right on the page.

3

Say "apply the queue"

Claude reads your marks and edits your real files. Refresh and mark up again for another pass.

The toolbar, up close

This is the actual Liquid HTML toolbar that sits on your page. Hover any button to see what it does.

Now try the whole loop

Pick a mode, then click anything on the sample page below. Comments pin a numbered note. Text Edit lets you retype the words.

Sample landing page

We build custom timber furniture.

Handmade in Melbourne, built to last a lifetime. Every piece is finished by hand and made to order.

  • Free design consultation
  • Ten year workmanship guarantee
  • Delivered Australia wide
Get a quote
Nothing here touches a real file. It is a safe sandbox that resets when you refresh.
On your own site, everything you queue here is what Claude applies to your actual files. You just tell it to go.
Full transparency

Every line is right here

Before you download anything, read it. This is the exact toolkit you get: a tiny local server, the in-page editor, and a demo page. No dependencies, no tracking, no secrets. You or Claude can inspect any file below.

README.md
Loading...

The same files are packaged in the download, so you never have to copy and paste them by hand.

Free download

Get Liquid HTML free

Grab the code straight from GitHub, or put your email in below to download the zip. Either way, unzip the file, connect the folder to Claude, and you'll get detailed instructions on next steps.

Download from GitHub

It's a public repo, so you can read every file before you run it.

or

Free forever. No spam. Unsubscribe any time.

FAQ

Good questions

What is Liquid HTML?+

A free, drop-in tool for editing static websites by pointing and clicking. You put any page in edit mode, click elements to leave notes or edit text directly, then hand the batch to Claude, which edits your real files.

What sites does it work on?+

Plain static HTML and CSS, with vanilla JavaScript being fine. It is not built for React, Next or static-site generators, because on those the editor runs on the compiled output rather than your source components.

Do I need to know how to code?+

No. You click the thing you want to change and type in plain English. Claude does the actual file editing. Small wording tweaks you can even make yourself, right on the page, with Text Edit.

Does it change my files directly?+

Text Edit writes plain-text changes straight to your source. Comments are queued and applied by Claude when you say so. The on-page overlay never touches your files until an edit is applied.

How does Claude apply the changes?+

The toolkit saves your marks to a small local file. You point Claude at the folder and say "apply the queue," and Claude edits the matching source files and clears the queue.

Is it really free?+

Yes, free to download and keep. We just ask for your email so we can send you the link and any future updates.