Convert any live website into editable Figma designs using a privacy-first Chrome Extension and Figma Plugin.
A debloated, telemetry-free, open-source replacement for the html.to.design Chrome Extension + Figma Plugin.
This workflow utilizes a Chrome Extension to read the live, fully rendered DOM of any website you are currently visiting (effortlessly bypassing CORS barriers, Auth walls, and SPA rendering limitations). It converts that DOM into a JSON representation and sends it directly to your Figma Desktop app, where the Plugin recursively builds native, editable Figma layers.
Core workflow:
Chrome Extension captures DOM → htmlToFigma() → JSON Payload → Figma Canvas Layers
The popular html.to.design plugin is a closed-source, paid tool. While other open-source options exist (like SSR's tooling), they are often tightly coupled to commercial ecosystems, packed with telemetry, and feature prominent upsells to Visual CMS platforms.
This repository provides a clean, stripped-down, and truly free alternative that you own and can extend. We leverage the fantastic open-source ssr-html-to-figma parsing engine and build a pure, privacy-respecting design utility around it.
Please follow the Setup Guide to initialize your local development environment, build the Chrome Extension, and load the Figma Plugin.
Everything runs entirely on the client—no API keys or external servers are required.
| Document | Description |
|---|---|
| CODEBASE_MAP.md | Origin git repositories mapped to local codebase |
| ARCHITECTURE.md | System design, data flow, Chrome ↔ Figma bridge |
| BUILD_PROMPT.md | Current engineering scope and active tasks |
| ROADMAP.md | Detailed phased feature plan |
This project is licensed under the MIT License — see LICENSE for details.