Tweaklify

Fast DOM prototyping & live style editing — click any element to inspect and tweak it instantly.

Tweaklify — Live DOM Editor & AI Page Builder Design faster. Prototype directly in the browser. No switching between editor and browser, no copying selectors into DevTools. Click the Tweaklify icon on any page and start editing instantly. 🖱 Point-and-Click Inspector Click any element on the page to select it. See its full HTML and computed CSS immediately. A live highlight shows exactly what you've selected, with a breadcrumb so you always know where you are. ✏️ Edit HTML Live Read and modify an element's raw HTML directly in a full-featured code editor (powered by Ace). Hit "Apply" and the change appears on the page instantly — no reload, no copy-paste. 🎨 Visual Style Editor Tweak any CSS property through clean, purpose-built controls — color pickers for colors, sliders for opacity, number spinners for spacing, and dropdowns for layout properties. Covers typography, background, layout, flexbox, borders, positioning, and transform. Changes apply to the page in real time. ✍️ Inline Text Editing Double-click any text element to edit its content directly on the page — just like clicking into a Google Doc. 🤖 AI Section Generator Describe a section in plain English and let AI build it for you. Type something like "a dark hero section with a gradient background, big headline, and two CTA buttons" — Tweaklify sends it to OpenAI and injects the generated HTML straight into the page. Preview the code before inserting, pick exactly where it goes, and re-use recent generations from your history. Your OpenAI API key is stored locally on your device and is only ever sent to OpenAI — never to any third-party server. 🌗 Three Themes Dark, Light, and Pink & Black. The panel is draggable and resizable so it stays out of your way. Perfect for: Frontend developers prototyping UI changes without touching the codebase Designers exploring layout and style options in context Anyone who wants to quickly mockup a new section or experiment with a page's look and feel Privacy: Tweaklify operates entirely locally. No data is collected, tracked, or transmitted — except OpenAI API calls you explicitly trigger yourself.