NickCirv/clone-any-app

GitHub: NickCirv/clone-any-app

输入 URL 即可借助 Claude AI 将任意网页逆向生成为整洁可编辑的 HTML+CSS+JS 代码。

Stars: 1 | Forks: 0

![clone-any-app — AI 逆向工程任意网页,生成整洁、可编辑的 HTML + CSS](https://static.pigsec.cn/wp-content/uploads/repos/2026/06/2e35a1b599204503.png) **只需提供一个 URL。几秒钟内即可获得一个可用的、可编辑的克隆版本 —— 由 Claude 提供支持。** ![license](https://img.shields.io/badge/license-MIT-blue?labelColor=0B0A09) ![node](https://img.shields.io/badge/node-%3E%3D18-brightgreen?labelColor=0B0A09) ![model](https://img.shields.io/badge/model-claude--opus--4--5-8B92F6?labelColor=0B0A09) ![requires](https://img.shields.io/badge/requires-ANTHROPIC__API__KEY-8B92F6?labelColor=0B0A09) 你看到一个精美的落地页,你也想要一个类似的。通常这意味着要在 DevTools 中花费数小时 —— 复制代码片段、猜测字体、从头重建间距。`clone-any-app` 跳过了所有这些步骤:它抓取页面,将 HTML 和 CSS 发送给 Claude,并生成整洁的语义化代码,你可以直接打开、编辑并发布。 ``` $ npx github:NickCirv/clone-any-app https://stripe.com/pricing clone-any-app v1.0.0 ───────────────────────────────── Target: https://stripe.com/pricing Output: /home/you/stripe-clone Model: claude-opus-4-5 ✔ Scraped — Stripe Pricing · 84.2KB HTML · 31.6KB CSS · 12 images ✔ AI clone generated — 19.4KB response ✔ Wrote 3 files to /home/you/stripe-clone Clone complete! ✓ index.html ✓ styles.css ✓ script.js Preview: open stripe-clone/index.html or npx serve stripe-clone ``` ## 安装 无需全局安装 —— 直接从 GitHub 运行: ``` export ANTHROPIC_API_KEY=sk-ant-... npx github:NickCirv/clone-any-app ``` ## 用法 ``` # 克隆页面到默认输出目录 (-clone/) npx github:NickCirv/clone-any-app https://linear.app # 指定自定义输出目录 npx github:NickCirv/clone-any-app https://vercel.com --output ./my-clone # 使用不同的 Anthropic model npx github:NickCirv/clone-any-app https://stripe.com/pricing --model claude-opus-4-5 ``` | 标志 | 描述 | |------|-------------| | `` | 要克隆的页面 URL(必填) | | `-o, --output ` | 输出目录(默认:`-clone`) | | `-m, --model ` | 使用的 Anthropic 模型(默认:`claude-opus-4-5`) | | `-V, --version` | 显示版本号 | | `-h, --help` | 显示帮助 | ## 工作原理 1. **抓取** —— 获取目标页面的 HTML、CSS 和图像元数据 2. **分析** —— Claude 读取视觉结构、布局、配色和排版 3. **生成** —— 输出整洁、语义化的 `index.html`、`styles.css` 和 `script.js` 4. **写入** —— 文件将保存在输出目录中,随时可以打开或编辑 这个克隆版本只是一个起点 —— 而不是像素级完美的复制品。它捕捉了设计的核心意图:布局结构、间距节奏、色彩系统和组件模式。 ## 环境要求 - Node.js 18+ - `ANTHROPIC_API_KEY` 环境变量需设置为有效的 `sk-ant-…` 密钥 ## 注意事项 - **不是像素级完美的截图复制品。** 它通过结构分析重新生成整洁的代码 —— 动态应用或重度依赖 JS 的应用可能只能生成部分结果。 - **不是绕过版权的工具。** 请用于学习、原型设计或创作受其启发的作品 —— 请勿用于复制专有设计以进行商业用途。 - **不是 SPA 的抓取工具。** 需要登录或大量客户端渲染的页面能提供给它处理的信息有限;请将输出视为一个结构化的起点。 ## 另请参见 - [one-prompt-saas](https://github.com/NickCirv/one-prompt-saas) — 通过一个提示词生成完整的 SaaS - [zero-to-prod](https://github.com/NickCirv/zero-to-prod) — 从空目录到部署应用的速度跑 - [readme-surgeon](https://github.com/NickCirv/readme-surgeon) — 使用 AI 升级任何 README
Node 18+ · MIT · 作者 NickCirv
标签:AI辅助编程, Claude API, MITM代理, Syscall, Web开发, 代码生成, 文档结构分析, 渗透测试工具, 网页克隆, 自定义脚本