Design Grabber — capture any iframe to HTML

Capture any iframe or page — including shadow-DOM web components — as a self-contained HTML file to preview, edit, save or share.

Design Grabber turns any rendered web UI into clean, reusable HTML. Point it at a page — or a single iframe on that page — and it captures the design exactly as you see it: layout, CSS, images, even components built with shadow DOM. No more digging through minified stylesheets or losing a design because you can't get back into the tool that made it. WHAT YOU CAN DO • Capture the whole page or any individual iframe — right-click → Capture, or pick from the toolbar popup (which shows a live count of the iframes on the page). • Preview & edit the captured HTML in a side-by-side live editor. • Download it as one standalone .html file. • Save straight to a folder on your computer as index.html + styles.css + README.md, named after the page. • Optionally publish a public, Figma-importable link (bring your own GitHub token or endpoint). WHY IT'S DIFFERENT • Real web-component support — most "save page" tools capture an empty shell. Design Grabber serializes open shadow roots and their styles, so components actually render. • Fully self-contained — CSS and images are inlined, so the file works offline and anywhere. • Static and safe — scripts and inline event handlers are stripped, so captures render with zero JavaScript. PERFECT FOR Design references, rebuilding a UI in Figma (via html.to.design), archiving a layout before a redesign, or learning how a component is built. PRIVACY 100% local. No servers, no analytics, no accounts, no tracking. Your captures and settings stay on your device. A capture leaves your computer only if you click Share — and then only to the account you configure yourself.