使用场景

开发者使用UICloner Extension克隆Facebook登录表单，并生成HTML+CSS代码。

设计师在设计原型时，利用插件快速将设计图转换为可交互的UI组件。

教育机构在教授前端开发课程时，使用插件向学生展示如何将UI设计快速转换为代码实现。

产品特色

一键选择：用户可以通过简单点击任何网站上的UI组件进行克隆。

多格式支持：支持生成HTML+Tailwind CSS或HTML+纯CSS代码。

实时预览：提供克隆UI和生成代码的实时预览功能。

AI驱动：利用AI技术实现UI组件的快速克隆和代码生成。

自定义API设置：用户可以设置自己的视觉LLM API，推荐使用GPT-4o或Claude 3.5。

易于集成：作为一个浏览器插件，可以轻松集成到用户的浏览器中，无需额外安装。

开源项目：代码开源，社区可以共同参与改进和功能扩展。

使用教程

1. 从Chrome Web Store安装UICloner插件。

2. 点击插件图标并设置视觉LLM API（推荐使用GPT-4o或Claude 3.5）。

3. 打开任意网页并点击插件图标。

4. 使用选择工具挑选网页上的UI组件。

5. 等待代码生成完成。

6. 复制生成的代码到你的项目中。