skills.rest
gopforever
gopforeverCOMMUNITY
Explore all skills by this author →
GitHub

website-cloning

Clone target websites into React + Vite apps with Playwright extraction.

Updated Apr 3, 2026
Search Tags:#react#playwright#vite#website#pixel-perfect#clone#design-extraction
One-click install
npx skills add https://github.com/gopforever/Idle-Echoes --skill website-cloning-gopforever
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: website-cloning
Source: https://github.com/gopforever/Idle-Echoes/tree/main/.local/secondary_skills/website-cloning
Command: npx skills add https://github.com/gopforever/Idle-Echoes --skill website-cloning-gopforever

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Reverse-engineering a target website and rebuilding it as a production-ready React + Vite app is labor-intensive and error-prone due to design drift, missing assets, and inconsistent responsive behavior.

Core Features & Use Cases

  • Pixel-perfect cloning of target sites into React + Vite apps
  • Automated asset collection and responsive layout reconstruction
  • Use cases include design references, migrations, and staging copies

Quick Start

Provide a target URL and initiate the cloning workflow to generate a pixel-perfect React + Vite clone with local assets.

Frequently Asked Questions about website-cloning

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I clone a website into a pixel-perfect React app?▼

To clone a website into a pixel-perfect React app, this tool uses Playwright-based extraction and design subagents to reconstruct the target site into a React + Vite clone with automated asset collection.

Do I need Playwright and Python to clone a website into a Vite app?▼

Yes, you need Playwright and Python to run the website cloning workflow, which relies on these dependencies for automated extraction and localized asset processing to ensure an offline build.

Can I use this for migrating client sites and creating staging copies?▼

Yes, you can use this for client-site migrations and staging copies, as it supports legitimate use cases like personal projects and design references while guiding users on ownership and compliance.

How does automated asset collection work when building a React clone?▼

Automated asset collection works by extracting and localizing target website assets into public/images and public/videos directories, ensuring the generated React + Vite application builds and runs completely offline.

What is the best way to reverse-engineer a website into a React project?▼

The best way to reverse-engineer a website into a React project is using parallel design subagents that handle responsive layout reconstruction and design extraction, minimizing design drift and missing assets.

What are the limitations of cloning a website into a Vite app?▼

Limitations include ensuring proper ownership and compliance for cloned content, and the requirement to localize all assets into specific public directories to maintain a functional offline React build.

Related Skills

Explore More Software Engineering Skills→
MakisuoMakisuo
1.6k

clickhousectl-local-dev

Install and configure a local ClickHouse environment with clickhousectl.

Community
Intermediate
binan-makerbinan-maker

website-cloning

Convert target websites into React + Vite clones using Playwright extraction.

Community
Advanced
kvm9-devkvm9-dev

website-cloning

Rebuild existing websites as pixel-perfect React and Vite applications.

Community
Advanced
bienhoangbienhoang
5

design-clone

Clone website designs via multi-viewport screenshots and HTML/CSS extraction.

Community
Advanced