构建、存储和重复使用组件
它不仅仅是一个组件库。你可以创建 UI 模块,利用 AI 生成图像和视频,构建 3D 场景和 GLSL 着色器——所有这些都具有实时预览和版本历史记录。
组件组
将各个模块整理成组。为用户界面组件、着色器、3D 场景和媒体资源创建自定义类别。确保所有内容井井有条,方便查找。
人工智能区块生成
利用人工智能,根据文本描述生成代码片段。您可以选择“直接生成”或“变体生成”模式,从而为 React、Vue、Svelte、Angular、SolidJS 或纯 JavaScript 创建组件。
GLSL着色器与3D图形
在一个实时沙箱中构建和预览 Three.js 场景、GLSL 着色器和 WebGL 内容。将它们存储为可重复使用的模块,以便在你的库中进行调用。
实时预览
每个代码块都配有实时预览面板。在编辑代码时,您可以即时查看代码更改的效果——无论您是在编辑 React 组件、GLSL 着色器还是 3D 场景。
批量创建模块
利用人工智能一次性生成多个模块。在一次生成过程中,批量创建组件的各种变体、配色方案、布局方案等等。
版本历史
全面记录所有区块类型的版本历史。追踪更改、回滚到之前的版本,并管理您在 React、Vue、Svelte、Angular、SolidJS 和纯 JavaScript 中的组件演进。
模块库与组织结构
模块库是您的个人组件存储库。您可以按类别(如 UI 组件、页面部分、着色器、3D 场景或任何自定义分类)创建分组,从而整理您的模块。每个模块都有一个详细视图,其中包含元数据、代码和实时预览。您可以从单个界面浏览、搜索和管理您的整个组件库。
- 创建自定义分组,以便按类别组织区块。
- 使用即时预览和元数据功能来阻止卡片。
- 详细视图,用于检查和编辑单个模块。
- 在整个资源库中搜索和筛选。
- 将模块拖动到线框图中。

人工智能驱动的模块创建工具
打开创作模式,借助 AI 辅助功能创建新的模块。使用 AI 提示框描述你想要的内容——例如登录表单、价格卡或导航栏——AI 将生成相应的代码。你可以选择“直接模式”从头开始创建模块,也可以选择“变体模式”基于现有模块生成不同的方案。
- 用于生成自然语言代码片段的人工智能提示框
- 直接模式(A)——根据文本描述生成代码块。
- 变体模式 (V)——生成现有区块的替代方案。
- 不同生成类型的 AI 生成类别
- 带有语法高亮和实时预览功能的代码编辑器。

GLSL着色器、Three.js和WebGL
“模块库”不仅仅限于用户界面组件。您可以在其中创建和存储 GLSL 着色器、Three.js 3D 场景和 WebGL 实验——所有这些都将在一个实时沙盒环境中进行渲染,并提供实时预览。您可以使用人工智能生成着色器代码或 3D 场景配置,然后将其保存为可重复使用的模块。
- 使用 Three.js 创建场景,并实时预览 3D 效果。
- 具有实时渲染功能的 GLSL 着色器编辑器
- 在沙盒环境中进行 WebGL 实验
- 人工智能生成的着色器和三维内容
- 在项目中存储并重复使用。

区块变体
只需一个提示,即可生成任意模块的多种变体。无论是 UI 组件还是 GLSL 着色器,人工智能都能创建一系列备选方案——每个方案都具有不同的风格、色彩搭配或结构方式。您可以并排预览这些方案,将您喜欢的方案保存到组中,或删除不需要的方案。
- 从单个文本段落或提示词中生成 5 种或 5 种以上的不同版本。
- 并排显示预览卡片,并进行实时渲染。
- 添加到群组,以便更好地管理不同版本。
- 一键保存或一键删除,方便批量管理。
- 可与用户界面组件、着色器、3D 场景等配合使用。

人工智能图像和视频生成
该功能已集成到区块库中,您可以使用 AI 图像生成器,通过 ComfyUI 本地或 6 个以上的云服务提供商,进行文本生成图像和图像生成图像的创作。使用 Kling、Veo 等工具,通过 AI 生成视频。从图像中创建 AI 生成的 Markdown 内容,以便与 CLI 工具配合使用。所有生成的媒体都可以作为区块存储在您的库中。
- 文本生成图像和图像生成图像——本地使用 ComfyUI 或通过 6 家以上的云服务提供商进行。
- 利用 Kling、Veo 等工具,将文本内容转化为视频,或将图像转化为视频
- 从图像生成 Markdown 文本,以便与命令行工具配合使用。
- 将生成的媒体素材存储为可重复使用的模块。
- 所有生成内容的完整版本记录。

