CodeFlux> AI生成式前端代码预览/微调辅助工具，前端代码在线运行/发布平台，codepen、jsbin、jsfiddle等的开源替代方案 在线体验：code-flux.anzz.top GitHub：github.com/xxxily/code-flux # 应用场景> 项目的主要目标是：结合AI生成前端代码的能力，以实现便捷地预览或微调AI生成的前端页面代码，快速发布能适应多场景的、高质量的、交互动效丰富的网页作品。 #### 1️⃣ AI生成的网页内容即时可视化 - 快速渲染AI生成的信息卡片、数据看板等可视化组件/页面- 实时预览个人主页、风格化简历等网页级作品- 动态调试SVG矢量图形与Canvas动画参数#### 2️⃣ 实现交互元素的敏捷开发 - 所见即所得编辑AI生成的表单组件- 即时验证AI生成的网页小游戏的交互逻辑- 可视化调整CSS动画关键帧与过渡效果#### 3️⃣ 产品原型的快速验证- 基于AI代码生成快速搭建原型页面- 快速体验产品设计期望的交互效果- 跨设备响应式布局实时调试更多实用场景，静待您的发掘～ # 界面截图# 在线案例#### 利用AI生成产品首页| Name | Prompt | Model | Link | Completeness | Notes ||-------------|--------|-------|---------------------------------------|-------|------|| CodeFlux介绍页 | - | DeepSeek-V3-0324 | 链接 | ★★★★☆ | - |#### 利用AI生成简单小应用| Name | Prompt | Model | Link | Completeness | Notes ||-------------|--------|-------|---------------------------------------|-------|------|| 牛B人生简历生成器 | - | DeepSeek-V3-0324 | 链接 | ★★★★★ | - || 高尔顿板模拟器 | content | gemini-2.5-pro-exp-03-25 | 链接 | ★★★★☆ | - |#### 利用AI创建小游戏| Name | Prompt | Model | Link | Completeness | Notes ||-------------|--------|-------|---------------------------------------|-------|------|| 奇幻贪吃蛇 | content | DeepSeek-V3-0324 | 链接 | ★★★★★ | - || 重力翻转跑酷 | content | DeepSeek-V3-0324 | 链接 | ★★☆☆☆ | - |# 运行/预览AI生成的前端代码在任意支持生成前端代码的AI平台上，使用提示词让AI生成你期望的前端网页，然后将生成的内容一键复制到 CodeFlux 平台上，即可对其进行运行/预览。- 注意：无需单独复制html、css、js等代码，直接复制AI生成的内容，然后粘贴到 CodeFlux 平台上， CodeFlux 平台会自动识别并分解成对应的前端代码。以在DeepSeek网站上生成的内容为例： 一键复制： 将复制到的内容直接粘贴到 CodeFlux 平台 点击确定，即可自动分解代码并进行运行/预览