skills.rest
AugustEmna
AugustEmnaCOMMUNITY
Explore all skills by this author →
GitHub

website-cloning

Clone websites into pixel-perfect React + Vite apps via Playwright extraction.

Updated Feb 10, 2026
Search Tags:#react#playwright#vite#website#pixel-perfect#clone#asset-download
One-click install
npx skills add https://github.com/AugustEmna/FlexMatch --skill website-cloning-augustemna
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: website-cloning
Source: https://github.com/AugustEmna/FlexMatch/tree/main/.local/secondary_skills/website-cloning
Command: npx skills add https://github.com/AugustEmna/FlexMatch --skill website-cloning-augustemna

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill enables reverse-engineering any target website into a pixel-perfect React + Vite clone, capturing the exact structure, typography, colors, assets, and interactions from the source for rapid design exploration and porting.

Core Features & Use Cases

  • Raw HTML is the source of truth and must be mirrored in the clone to ensure fidelity.
  • Library-agnostic scaffolding: build a minimal React app (no router boilerplate) that renders all sections in DOM order with precise assets.
  • Asset, font, and SVG extraction and local hosting to avoid runtime downloads, enabling offline previews and consistent rendering.

Quick Start

Begin by capturing the target site's raw HTML and assets, then scaffold and assemble a pixel-perfect React + Vite clone guided by the source structure.

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 React and Vite project?▼

You clone a website into React and Vite by capturing the target site's raw HTML and assets, then scaffolding a minimal React app that renders all sections in DOM order with locally hosted assets for pixel-perfect fidelity.

What is the best way to extract website assets and fonts for offline React previews?▼

Extracting website assets for offline React previews involves using Playwright-backed extraction to download fonts, SVGs, and images locally, avoiding runtime downloads and ensuring consistent rendering without network dependencies.

Does Playwright work for capturing responsive website layouts to port into a React clone?▼

Yes, Playwright works for capturing responsive website layouts by extracting the target site's structure, content, and assets across desktop and responsive views, ensuring the React and Vite clone mirrors the source HTML precisely.

Can I scaffold a React app without router boilerplate when cloning an existing site?▼

Yes, you can scaffold a React app without router boilerplate when cloning a site by building a minimal Vite application that renders all extracted HTML sections in DOM order, focusing strictly on source content fidelity.

Why does my website clone lose pixel-perfect fidelity compared to the original source?▼

Your website clone loses pixel-perfect fidelity when raw HTML is not treated as the source of truth, or when design tokens, typography, and colors are not extracted precisely from the target site's structure and assets.

Related Skills

Explore More Design & Creative Skills→
soq123soq123

website-cloning

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

Community
Advanced
horuz-aihoruz-ai
5

website-cloner

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

Official
Advanced
kmshihab7878kmshihab7878
6

clone-website

Clone public websites into componentized Next.js projects via Playwright extraction.

Community
Advanced
GrupoUSGrupoUS
1

frontend-design

Generate frontend interfaces in React, Vue, or vanilla HTML/CSS/JS.

Community
Advanced