图片 → 配色本地预览+拖入图片,提取主要颜色或点击选择图片#506f88#d3b89c#f5efe6Live Demo在线预览查看模块 ↗图片取色Color Extraction♡多模态Canvas · React
玻璃拟态卡片 · Glass Surface可调参数第 001 期 · 玻璃拟态让表面变得可复用。模糊 18px · 指针高光模糊 18px透明度 16%边框 30%阴影 28%高光 26%Live Demo在线预览查看模块 ↗玻璃拟态卡片Glass Surface♡Visual EffectsCSS · React
AI 思考过程面板 · AI Reasoning Panel本地状态演示用户问题帮我把这份需求整理成发布计划。处理过程摘要等待开始↓正在整理问题范围、相关信息和答案结构。·识别问题范围等待中·整理可公开信息等待中·组织答案结构等待中仅展示可公开的处理摘要,不展示模型私密思维链。开始演示预览只模拟公开状态,不调用模型,也不展示私密思维链。Live Demo在线预览查看模块 ↗AI 思考过程面板AI Reasoning Panel♡AI 对话React · TypeScript
AI 操作授权确认卡 · AI Action Approval Card本地状态演示AI 工作台清理本次任务产生的临时文件高风险动作执行前,先把范围和影响说清楚。!需要你的确认AI 准备执行一个不可自动撤销的动作。准备执行删除临时导出文件影响对象/exports/draft-preview.png风险说明删除后无法从当前任务中恢复等待你的确认拒绝允许一次当前页面只模拟交互状态,不会删除文件或执行真实操作。Live Demo在线预览查看模块 ↗AI 操作授权确认卡AI Action Approval Card♡Free UIReact · TypeScript
玻璃光斑卡片 · Magic Card指针跟随第 002 期 · 玻璃光斑移动指针。边框跟着光亮起来。光斑 · 边框 · 倾斜光斑 32%强度 72%倾斜 1.8°Live Demo在线预览查看模块 ↗玻璃光斑卡片Magic Card♡Visual EffectsReact · CSS
流式聊天回复 · Streaming Chat本地状态演示AIAI 助手等待发送你为什么 AI 回复要一边生成,一边显示?开始演示预览只模拟本地文本流,不调用模型,也不会发送消息。Live Demo在线预览查看模块 ↗流式聊天回复Streaming Chat♡AI 对话React · TypeScript
连接光束 · Connection Beam响应式路径输入提示词数据知识库工具API处理AI输出结果速度 2.4s弯曲 45%方向:向内Live Demo在线预览查看模块 ↗连接光束Connection Beam♡Agent 工作流React · SVG
命令面板 · Command Palette键盘完整操作打开命令面板⌘ K支持鼠标与键盘操作⌕ESC项目新建项目创建一个空白工作区N最近项目打开最近编辑的项目R搜索全局搜索查找页面、文件和知识条目S界面切换主题切换浅色与深色外观T系统打开设置进入偏好与账户设置⌘ ,Live Demo在线预览查看模块 ↗命令面板Command Palette♡Agent 工作流React · TypeScript
智能文件上传区本地状态预览文件不会离开浏览器,仅用于演示选择、校验、进度和完成反馈。↑拖入文件,或点击选择支持图片和 PDF · 单个不超过 10 MB选择文件等待选择文件Live Demo在线预览查看模块 ↗智能文件上传区File Upload Dropzone♡多模态React · TypeScript
拖拽排序列表指针与键盘可用拖动左侧手柄调整步骤;也可以点击上下按钮,或聚焦手柄后按方向键。⠿01整理系统提示定义角色、边界与输出格式提示词↑↓⠿02接入知识内容补充检索结果与参考资料上下文↑↓⠿03生成第一版结果运行主要生成任务模型↑↓⠿04校验最终结果检查格式并准备发布输出↑↓拖动手柄,或使用上下按钮调整顺序Live Demo在线预览查看模块 ↗拖拽排序列表Sortable List♡Free UIReact · TypeScript
智能聊天输入框本地交互预览新对话今天想完成什么?▧产品需求.pdfPDF · 本地示例×把这份需求整理成三个清晰的产品方案Enter 发送,Shift + Enter 换行。Live Demo在线预览查看模块 ↗智能聊天输入框Prompt Composer♡AI 对话React · TypeScript
可折叠侧边栏桌面与移动端☰ 打开导航当前页面项目概览收起后仍保留图标、当前项和辅助提示。Live Demo在线预览查看模块 ↗可折叠侧边栏Collapsible Sidebar♡FoundationReact · TypeScript
堆叠通知新增 · 展开 · 补位添加通知展开通知✓成功内容已保存3 个页面已经同步到当前项目。×i通知正在生成预览背景任务仍在继续,可以先处理其他内容。×!提醒有 1 个文件需要处理请确认图片尺寸后重新上传。查看×这是本地交互预览,不会发送网络请求。Live Demo在线预览查看模块 ↗堆叠通知Toast Stack♡FoundationReact · TypeScript
图片桌宠换图 · 拖拽 · 待机选择本地图片恢复默认位置● ● ●本地桌面预览透明 PNG 效果最佳今天的任务拖动桌宠,看看边界反馈拖我拖动角色,或聚焦后使用方向键移动。 普通照片可以载入;这个模块不声称自动移除复杂背景。Live Demo在线预览查看模块 ↗图片桌宠Image Desktop Pet♡Free UIReact · TypeScript
文本选区工具栏选择 · 定位 · 保留AI 写作工作台选中文字查看操作优秀的编辑工具会把操作放在内容附近,让用户保持当前阅读节奏。选中这段文字,工具栏会跟随选区出现;取消选择以后,它会自动隐藏。真正接入模型时,请在业务层处理请求、取消、错误和内容写回。请在文稿中选中一段文字。 当前预览只演示交互,不调用模型。Live Demo在线预览查看模块 ↗文本选区工具栏Text Selection Toolbar♡内容工具React · TypeScript
圆形主题切换 · Circular Theme Reveal点击右上角第 014 期 · 圆形主题切换让主题跟着点击展开。点击右上角按钮,观察变化从操作位置扩张到四个角。今日任务12完成进度68%运行状态正常☾深色当前为浅色主题 · 支持键盘与减少动画Live Demo在线预览查看模块 ↗圆形主题切换Circular Theme Reveal♡Visual EffectsReact · TypeScript
卡片变形弹窗 · Morphing Dialog点击卡片AI MODULEAI 回复结构把输入、检索和生成状态放进同一张详情卡。↗支持 Esc、点按外部、焦点循环与减少动画。Live Demo在线预览查看模块 ↗卡片变形弹窗Morphing Dialog♡Free UIReact · TypeScript
预览准备中这个能力模块已经加入内容目录。完成自研实现和验证后,会补充在线交互预览。Preview在线预览查看模块 ↗照片散落动画Photo Scatter♡Visual EffectsReact · CSS
预览准备中这个能力模块已经加入内容目录。完成自研实现和验证后,会补充在线交互预览。Preview在线预览查看模块 ↗抽卡揭示动画Draw Card Animation♡Visual EffectsReact · CSS
预览准备中这个能力模块已经加入内容目录。完成自研实现和验证后,会补充在线交互预览。Preview在线预览查看模块 ↗渐变背景Gradient Background♡Visual EffectsCSS · React
预览准备中这个能力模块已经加入内容目录。完成自研实现和验证后,会补充在线交互预览。Preview在线预览查看模块 ↗票根分享海报Ticket Share Poster♡内容工具React · Canvas