AI Website Cloner Template is a starter project that lets an AI coding agent recreate a website from its URL as a Next.js application. It is intended for people using coding agents such as Claude Code, Codex, Cursor, or Gemini to generate website projects. Its catalogue add-ons define the instructions, command, skill, and rule used in that cloning workflow.
Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add JCodesMore/ai-website-cloner-template --skill clone-websitegit clone --depth 1 https://github.com/JCodesMore/ai-website-cloner-templateWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/jcodesmore/ai-website-cloner-template/clone-website)<a href="https://agentmods.dev/skills/jcodesmore/ai-website-cloner-template/clone-website"><img src="https://agentmods.dev/badge/skills/jcodesmore/ai-website-cloner-template/clone-website.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00096 | $0.08385 |
| Opus 5 | $0.00048 | $0.04193 |
| Sonnet 5 | $0.00019 | $0.01677 |
| Haiku 4.5 | $0.00010 | $0.00839 |
Grade A, and why
clone-website scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 7d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 528 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Clone Website
You are about to reverse-engineer and rebuild $ARGUMENTS as pixel-perfect clones.
When multiple URLs are provided, preserve every pathname as a distinct route and isolate each target's research, screenshots, components, and assets. URLs that differ only by query string or fragment share a pathname, so resolve their route and state behavior explicitly in the output plan. Parallelize page work only after the shared foundation and output plan are fixed so concurrent builders cannot overwrite one another.
This is not a two-phase process (inspect then build). You are a foreman walking the job site — as you inspect each section of the page, you write a detailed specification to a file, then hand that file to a specialist builder agent with everything they need. Extraction and construction happen in parallel, but extraction is meticulous and produces auditable artifacts.
Scope Defaults
The target is whatever page $ARGUMENTS resolves to. Clone exactly what's visible at that URL. Unless the user specifies otherwise, use these defaults:
- Fidelity level: Pixel-perfect — exact match in colors, spacing, typography, animations
- In scope: Visual layout and styling, component structure and interactions, responsive design, mock data for demo purposes
- Out of scope: Real backend / database, authentication, real-time features, SEO optimization, accessibility audit
- Customization: None — pure emulation
If the user provides additional instructions (specific fidelity level, customizations, extra context), honor those over the defaults.
Output Isolation and Route Preservation
Treat every target URL as durable project output, not as permission to replace whatever was built previously.
Choose an <app-root> before extraction. For a single application, <app-root> is the repository root (.). If different origins need separate applications, require the user to provide or approve a prepared Next.js project root for each origin; verify each root builds independently, and never write one origin's output into another root.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 7d ago First seen · 528 lines · 96 tokens per session scan A 47375f9af901
clone-website is a skill published in the GitHub repository JCodesMore/ai-website-cloner-template (33,910 stars, last pushed 22d ago), licensed MIT. It adds 96 tokens to every session and 8,385 once invoked, about $0.0005 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
react-artifact
Author app-like designs in React/JSX and bundle them in-sandbox into the same single self-contained HTML artifact Design Studio delivers. Use when the design needs real state, complex interactivity, or component reuse beyond what vanilla JS comfortably handles.
generic-react-ux-designer
Professional UI/UX design expertise for React applications. Covers design thinking, user psychology (Hick's/Fitts's/Jakob's Law), visual hierarchy, interaction patterns, accessibility, performance-driven design, and design critique. Use when designing features, improving UX, solving user problems, or conducting design…
frontend-enhancer
This skill should be used when enhancing the visual design and aesthetics of web applications. It provides modern UI components, design patterns, color palettes, animations, and layout templates. REQUIRES ui-research skill first. Use this skill for tasks like improving styling, creating responsive designs…
generic-design-system
Complete design system reference for any project - colors, typography, spacing, components, animations. Adapts to project theme and tech stack. Use when implementing UI, choosing colors, creating animations, or ensuring brand consistency. For new design systems, use ui-research skill first.
generic-fullstack-ux-designer
Professional UI/UX design expertise for full-stack applications. Covers design thinking, user psychology (Hick's/Fitts's/Jakob's Law), visual hierarchy, interaction patterns, accessibility, performance-driven design, and design critique. Use when designing features, improving UX, solving user problems, or conducting…
generic-react-design-system
Complete design system reference for React applications. Covers colors, typography, spacing, component patterns, glassmorphism effects, GPU-accelerated animations, and WCAG AA accessibility. Use when implementing UI, choosing colors, applying spacing, creating components, or ensuring brand consistency.