skills.rest
bcwgames
bcwgamesCOMMUNITY
Explore all skills by this author →
GitHub

website-cloning

Convert a live website into a local React + Vite clone via Playwright extraction.

Updated Jan 6, 2026
Search Tags:#automation#React#Playwright#Vite#website cloning#web asset extraction
One-click install
npx skills add https://github.com/bcwgames/FNaF-TVE --skill website-cloning-bcwgames
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: website-cloning
Source: https://github.com/bcwgames/FNaF-TVE/tree/main/Five-Nights-At-Freddys-The-Virtual-Experience/.local/secondary_skills/website-cloning
Command: npx skills add https://github.com/bcwgames/FNaF-TVE --skill website-cloning-bcwgames

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill enables you to reproduce a target website as a pixel-perfect React + Vite clone by extracting the source HTML, assets, and structure for offline development and design reference.

Core Features & Use Cases

  • Automated extraction of raw HTML, assets, and layout references to recreate pages locally.
  • Guidance for asset downloading, SVG logo extraction, header/footer data, and design tokens.
  • Ideal for design references, migration planning, or creating offline development environments.

Quick Start

Provide a target URL and let the Playwright-based workflow extract raw HTML and assets to begin scaffolding a local React + Vite clone.

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?▼

To clone a website into a React and Vite project, this skill uses a Playwright-driven workflow to extract raw HTML, assets, and layout structure, scaffolding a local development environment with pixel-perfect accuracy.

Can I extract CSS design tokens and assets from a live website?▼

Yes, you can extract design tokens, SVG logos, and header/footer data from a live website. The extraction process collects these assets to support a faithful and pixel-perfect reconstruction locally.

Does Playwright work for automated web asset extraction and offline development?▼

Playwright works for automated web asset extraction by driving the browser to capture exact HTML content and structure. This enables the creation of offline development environments with full asset integrity.

What is the best way to pixel-perfect clone raw HTML for design reference?▼

The best way to pixel-perfect clone raw HTML for design reference is using an automated Playwright extraction workflow that enforces exact source content and structure, converting it directly into a local React application.

Do I need React and Vite to use extracted website assets for platform migrations?▼

You need React and Vite because the extracted website assets and raw HTML are scaffolded specifically into a local React and Vite clone, ensuring the platform migration or offline environment maintains pixel accuracy.

Related Skills

Explore More Software Engineering Skills→
4lerman4lerman

browser-automation

Automate browser tasks and web scraping with Playwright.

Community
Advanced
rloisellrloisell
7

bc-gov-design-system

Standardize BC Gov React/Vite frontends with reusable components, tokens, and font loading.

Community
Advanced
bhushanofficial69-specbhushanofficial69-spec

website-cloning

Clone websites into React + Vite apps using Playwright extraction.

Community
Advanced
GrupoUSGrupoUS
1

frontend-design

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

Community
Advanced