skills.rest
binan-maker
binan-makerCOMMUNITY
Explore all skills by this author →
GitHub

website-cloning

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

Updated Feb 24, 2026
Search Tags:#automation#React#Playwright#Vite#pixel-perfect#web-scraping#website-clone
One-click install
npx skills add https://github.com/binan-maker/QRS --skill website-cloning-binan-maker
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: website-cloning
Source: https://github.com/binan-maker/QRS/tree/main/.local/secondary_skills/website-cloning
Command: npx skills add https://github.com/binan-maker/QRS --skill website-cloning-binan-maker

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Quickly convert target websites into pixel-perfect React + Vite clones by using a Playwright-driven extraction pipeline, eliminating manual recreation from screenshots or memory.

Core Features & Use Cases

  • Pixel-perfect replication: identical typography, color, assets, layout, and interactions sourced from raw HTML.
  • Deterministic build process: all assets are downloaded upfront and built from the source of truth (raw HTML) to ensure fidelity.
  • Real-world usage: create clones for design reference, migration demos, or offline prototyping.

Quick Start

Run the extraction workflow to capture raw HTML, then scaffold a React + Vite clone using the recorded inventory and 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 React and Vite with pixel-perfect fidelity?▼

To clone a website into React and Vite, this Skill uses a Playwright extraction pipeline to capture raw HTML and assets, then scaffolds the project using an inventory-guided build for pixel-perfect layout replication.

What is the best way to automate website cloning for design reference?▼

Automating website cloning requires extracting the source-of-truth HTML and downloading assets upfront. This ensures deterministic reproducibility for design reference, migration demos, or offline prototyping without manual screenshot recreation.

Does the pixel-perfect cloning process require manual asset downloading?▼

No, the pixel-perfect cloning process enforces upfront asset downloads automatically. It builds the React clone from raw HTML using a recorded inventory, ensuring all typography, colors, and layout components match the original.

How does Playwright extraction work for converting websites to React components?▼

Playwright extraction captures the raw HTML of the target website as the source of truth. This raw HTML and asset inventory then guides the scaffolding of a React and Vite clone, ensuring deterministic and reproducible results.

Can I use this website cloning approach for offline prototyping and migration demos?▼

Yes, you can use this website cloning approach for offline prototyping and migration demos. It captures real-world interactions and assets, converting target websites into pixel-perfect React and Vite clones for high-fidelity reference.

Why should I use a source-of-truth HTML workflow instead of screenshots for website replication?▼

A source-of-truth HTML workflow ensures pixel-perfect replication by capturing actual typography, color, and layout data. Unlike manual recreation from screenshots, it eliminates guesswork and guarantees deterministic build results.

Related Skills

Explore More Design & Creative Skills→
soq123soq123

website-cloning

Clone target websites into React + Vite apps from raw HTML.

Community
Advanced
Exocore-OrganizationExocore-Organization
5

website-cloning

Clone websites into React + Vite apps via Playwright extraction.

Official
Advanced
YSheldonYSheldon

recreate-screenshot

Recreate UI screens from screenshots with pixel-perfect layout, color, and typography fidelity.

Community
Advanced
horuz-aihoruz-ai
5

website-cloner

Clone websites into React components with Tailwind and motion via multi-agent QA workflow.

Official
Advanced