What tech stack is used for the generated code?

The skill uses a fixed, modern stack: Next.js 16 (App Router), TypeScript, Tailwind CSS v4, Shadcn UI, and Lucide React icons.

Is the generated code mobile-friendly?

Absolutely. The skill follows mobile-first responsive design principles and uses Tailwind CSS utilities to ensure the output works across all screen sizes.

Does this skill require any external integrations?

Yes, this skill requires the Firecrawl MCP to be configured to handle the initial web scraping and data extraction phases.

How does this skill handle images during the cloning process?

The skill attempts to download original images from the target URL; if a download fails, it automatically applies context-aware Unsplash placeholders for hero sections, avatars, and features.

Can I clone only a specific part of a website?

Yes, you can request partial clones by specifying sections such as 'clone the hero section' or 'just the pricing table' to generate only the relevant components.

Website Clone & Replicate

Name: Website Clone & Replicate
Author: julianromli

byjulianromli

•

123

•

Web Scraping & Data Collection

Replicates existing websites into production-ready Next.js 16 and Tailwind CSS v4 codebases using Firecrawl MCP.

This skill automates the process of migrating or recreating web designs into a modern development stack. By leveraging Firecrawl for precise scraping and mandatory structural analysis, it breaks down existing layouts into reusable Shadcn components, extracts design tokens, and generates clean, responsive Next.js 16 code. It is an essential tool for developers looking to prototype landing pages, migrate legacy sites, or quickly replicate specific UI patterns with pixel-perfect accuracy and modern coding standards.

Key Features

01Flexible partial cloning for specific sections like hero units, pricing, or footers

02Intelligent image extraction with automated Unsplash fallbacks

03Automated website scraping and crawling via Firecrawl MCP integration

04Pixel-perfect UI replication with mobile-first responsive design

05Production-ready code generation using Next.js 16 and Tailwind CSS v4

06123 GitHub stars

Use Cases

01Rebuilding existing web designs into clean, componentized, and type-safe codebases

02Migrating legacy landing pages to a modern Next.js App Router framework

03Replicating specific high-performing UI sections for rapid design prototyping

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add julianromli/ai-skills clone-website

For use in Claude.ai and ChatGPT

Download Skill