CloneWebsite - Pixel Perfect Page Cloner

About

CloneWebsite is a powerful Chrome extension that lets you clone any webpage with 100% pixel-perfect accuracy. Whether you're a developer studying UI patterns, a designer capturing inspiration, or a team building a component library, CloneWebsite gives you a complete, self-contained snapshot of any page in seconds.

★ Key Features

• Pixel-Perfect Cloning — Captures the full computed styles, DOM structure, and visual layout of any page exactly as it appears in the browser.
• Resource Extraction — Automatically downloads and bundles images, fonts, CSS, and JavaScript files into a single ZIP archive.
• Smart Script Filtering — Removes tracking, analytics, and other non-essential scripts so your clone stays clean and lightweight.
• Local Project Library — Save cloned pages to IndexedDB for offline access. No account or cloud sync required.
• Workbench — Preview, edit, and re-export saved projects without leaving the extension.
• Magic Paste — Convert cloned HTML into ready-to-use React or Vue component code with a single click.
• BYOK AI — Bring your own OpenAI-compatible API key to stream AI-assisted code modifications directly in the Workbench.
• ZIP Download — Every clone is packaged as a standalone ZIP with a clean folder structure, ready to open locally.

★ How It Works

1. Click the extension icon on any page you want to clone.
2. Choose "Clone Page" for the full page or "Clone Component" to select a specific element.
3. CloneWebsite freezes the DOM, extracts all resources, and builds a self-contained HTML file.
4. Download the ZIP, save to your local project library, or open the Workbench to preview and edit.
5. Use Magic Paste to generate React/Vue component code from the cloned HTML.

★ Privacy First

All cloning and processing happens locally in your browser. CloneWebsite does not collect, store, or transmit your personal data. AI features are optional and only connect to endpoints you explicitly configure.

★ Who Is It For?

• Frontend developers studying real-world CSS layouts and component patterns
• UI/UX designers capturing design references and visual inspiration
• Teams building internal component libraries from existing pages
• Educators and learners exploring how websites are built

★ Technical Details

• Built with Plasmo (MV3), React, and TypeScript
• Uses Chrome scripting + storage APIs
• No background data collection
• Optional AI integration via user-provided OpenAI-compatible endpoints