skills.rest
Linnanli
LinnanliCOMMUNITY
Explore all skills by this author →
GitHub

web-clone

Clone live websites by extracting visual layout and basic interactivity with Playwright MCP.

1|Updated Mar 15, 2026
Search Tags:#automation#frontend#website#clone#playwright-mcp#visual-verification#web-clone
One-click install
npx skills add https://github.com/Linnanli/xClaw --skill web-clone-linnanli
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-clone
Source: https://github.com/Linnanli/xClaw/tree/main/.codex/skills/web-clone
Command: npx skills add https://github.com/Linnanli/xClaw --skill web-clone-linnanli

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Clone a live website to reproduce its visual appearance and core interactive behavior, enabling demonstrations, offline exploration, and rapid prototyping.

Core Features & Use Cases

  • Visual fidelity: replicate layout, typography, colors, and spacing
  • Functional parity: reproduce core interactions such as navigation, forms, modals, and responsive behavior
  • Use case: design QA, demonstrations, and offline testing with a live URL

Quick Start

Provide a live URL and the tool will generate a pixel-faithful clone with core interactions

Frequently Asked Questions about web-clone

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

FAQPage Schema
How do I clone a live website for offline testing?▼

To clone a live website, you provide a live URL to the tool, which then extracts the visual layout and basic interactivity to reproduce the site locally for offline testing or demonstration. It requires a Playwright MCP environment to automate rendering.

Do I need Playwright to replicate a website's visual fidelity?▼

Yes, replicating visual fidelity requires a Playwright MCP environment to automate rendering and validate layout, typography, colors, and spacing against the source URL.

Can I reproduce website interactions like navigation and forms from a live URL?▼

You can reproduce core website interactions like navigation, forms, and modals from a live URL. The tool validates functional parity to ensure responsive behavior matches the original site.

What is the best way to create a working replica of a public site for demonstration?▼

The best way to create a working replica for demonstration is using a live URL rather than static screenshots. This approach reproduces both visual appearance and core interactive behavior for rapid prototyping.

Does cloning a website with this approach work with static screenshots?▼

No, cloning a website with this approach does not work with static screenshots. It requires live URLs to automate rendering and extract both visual layout and functional interactivity for an accurate replica.

Related Skills

Explore More Software Engineering Skills→
dallaydallay

webapp-testing

Automate Playwright browser testing and debugging for local web applications.

Official
Intermediate
omeraltnomeraltn

agency-evidence-collector

Analyze Playwright screenshot captures to identify visual and interactive UI defects.

Community
Intermediate
timogilvietimogilvie

frontend-design

Generate distinctive frontend interfaces with HTML, CSS, JavaScript, React, or Vue.

Community
Intermediate
chrismccoychrismccoy
2

page-cloner

Clones a live webpage into standalone HTML with preserved markup, styles, and assets.

Community
Advanced