SuperAPI AI 工具集

ui-cloner

前端与建站

查看项目

更新于 10-15 21:34

技能介绍

用途:克隆任意网站的设计并适配到自有品牌,适合需要复刻网站视觉与动效的场景。

主要能力:分 5 个阶段工作。阶段 1 站点 DNA 提取,用 Chrome 抓取参考站,逐屏截图,提取 CSS @keyframes、GSAP 配置、滚动行为图、悬停规则,并划分动画复杂度层级(1 简单到 4 极端)。阶段 2 品牌访谈,向用户提出 8-10 个针对性问题。阶段 3 合并映射,生成逐区块构建规格,含具体动画代码。阶段 4 生成构建提示,包含库匹配动画代码、CDN 链接和精确缓动/时序值。阶段 5 迭代器,从视觉和行为两方面对比参考站与实现。

使用方式:需 Chrome 访问权限,用户须运行 claude --chrome 或启用浏览器控制。典型命令为“Clone this site: https://example.com”。所有工作文件生成在 ./ui-clone-workspace/ 目录。默认技术栈为单个 index.html,通过 CDN 引入 Tailwind CSS、阶段 1 检测到的动画库和 Google Fonts。

限制:阶段 4 对 Tier 4(Three.js、WebGL、着色器等)会警告用户,仅对标准元素实现 Tier 3 并提供 CSS 回退。动画库必须匹配,参考站用 GSAP 则构建必须用 GSAP。若同时使用 Lenis 与 ScrollTrigger,必须包含同步代码。构建后需在 Chrome 中滚动测试。具体收费、价格、平台支持范围等资料暂未提供。