AI Website Cloner Template

Overview

The AI Website Cloner Template is a Next.js-based project that gives an AI coding agent a URL and asks it to recreate the website as a clean app. It provides a clone-website skill, agent instructions, source-specific route and asset organization, and a comparison workflow for mapping, observing, building, and checking the result.

Key Features

• One-command website cloning through an AI coding agent using the clone-website skill with a target URL.
• Four-step workflow: map source URLs to local routes, observe desktop and mobile pages, build editable components, and compare source and local pages.
• Supports Claude Code, Codex CLI, OpenCode, and Cursor, with Claude Code and Opus 5.5 recommended for best results.
• Includes Next.js 16, React 19, TypeScript strict, shadcn/ui, Tailwind CSS v4, and Lucide React foundations.
• Organizes source-specific components, extracted SVGs, images, fonts, videos, research notes, and comparison screenshots in the project structure.
• Provides commands for development, production build, lint, typecheck, combined check, and Docker-based app or development runs.

Use Cases

• Platform migration: rebuild a site you own from WordPress, Webflow, or Squarespace into a modern Next.js codebase.
• Lost source code: recover a live site in a modern format when the repository is gone, the developer left, or the stack is legacy.
• Learning: deconstruct how production sites achieve specific layouts, animations, and responsive behavior by working with real code.

Getting Started

• Set up the project by asking an agent to clone the repository into a new folder, remove its origin remote, install dependencies, and run npm run check.
• Alternatively, create a GitHub repository from the template, then ask the agent to clone it, install dependencies, and run npm run check.
• Open the project in an agent with browser access enabled and run the clone-website command with the target website URL.

Deployment & Requirements

• Node.js 24 or later.
• An AI coding agent such as Claude Code, Codex CLI, OpenCode, or Cursor.
• Browser access enabled in the agent for cloning.
• Docker Compose can build and run the app or run the app in development mode on port 3001.

Before You Adopt

• License: MIT. Review its terms before using, modifying, or distributing the project.