Point and click any element on your site, describe the change in plain English, and Layrr edits your actual source files. Not a platform. Not a page builder. A CLI tool that works with your existing codebase.
npm install -g layrr
Most AI website editors force you onto their platform. You lose control of your code, your hosting, and your workflow. Layrr takes a different approach.
Layrr does not generate a separate copy. It modifies your real .jsx, .vue, .svelte, .astro, or .html files directly. What you see in your editor is what changed.
No WYSIWYG canvas. Click the element you want to change, describe the edit in plain English, and Claude Code rewrites the code. Your dev server hot-reloads instantly.
No account to create. No dashboard. No subscription. Install from npm, run one command, and start editing. Uninstall anytime with zero residue.
Every AI edit produces a clean diff in your Git repo. Review changes, revert if needed, create branches, and commit exactly like your normal workflow.
Deploy to Vercel, Netlify, AWS, your own server, anywhere. Layrr does not host, does not store, and does not own any of your code. MIT licensed.
Tell it "make the header sticky" or "add a dark mode toggle" and Claude Code handles the implementation. No manual coding required for visual changes.
Install, point at your dev server, and start editing visually with AI
npm install -g layrr
layrr --port 3000
Install from npm globally, then point Layrr at the port your dev server is running on. It proxies the traffic and injects the editing overlay.
Switch to Edit mode in the overlay. Hover to highlight elements, click to select one. Layrr traces it back to the exact source file and line number in your codebase.
Type what you want in plain English. "Make this section full-width," "change the background to dark blue," or "add a testimonials carousel." Claude Code edits the source, your dev server hot-reloads. Done.
Tools like Bolt, v0, and Lovable generate new apps from scratch. Layrr edits the project you already have.
| Layrr | Bolt / v0 / Lovable | Wix / Webflow | |
|---|---|---|---|
| Edits existing codebases | |||
| You own the code | |||
| Works with any framework | |||
| No platform lock-in | |||
| Runs locally | |||
| Open source (MIT) |
Great for generating new apps from a prompt. But what about your existing React app with 200 components? Layrr is built specifically for editing projects that already exist.
Proprietary platforms that own your layout engine. You cannot take your code and run it elsewhere. Layrr edits standard code you deploy anywhere.
AI code editors work in your text editor. Layrr works in your browser. Click the element visually, and AI knows exactly which file and component to edit.
Layrr connects to any dev server. If it runs in a browser, Layrr can edit it.
JSX, TSX, Next.js
SFC, Nuxt
SvelteKit
.astro files
Plain HTML/CSS/JS
An AI website editor is a tool that uses artificial intelligence to help you make changes to websites. Instead of manually writing code or dragging elements around a canvas, you describe the changes you want in plain English and AI implements them. Layrr is an AI website editor that works directly with your source code, so changes are real code edits, not visual-only modifications.
Bolt, v0, and Lovable are designed for generating new applications from scratch using a prompt. Layrr is designed for editing existing projects. If you already have a codebase with components, styles, and logic, Layrr lets you visually select any element and modify it with AI, without starting over.
Layrr is free and open source under the MIT license. You will need a Claude Code subscription for the AI editing capabilities, but Layrr itself has no cost, no account requirement, and no usage limits.
Layrr works with React, Vue, Svelte, Astro, plain HTML, and any other framework that runs a local dev server. It is completely framework-agnostic because it works at the browser level and uses Claude Code to edit the source files.
No. Layrr does not require any configuration files, plugins, or changes to your project. Just start your dev server as usual, then run layrr --port 3000 (using your dev server's port). It injects the editing overlay via a proxy.
Install in seconds. Point at your dev server. Click any element and describe the change. Your code updates instantly.
npm install -g layrr