选择样式

所有修改立即反映在中间。

实时预览

切换容器，检查它在真实界面里的样子。

动画时间线状态停留 → Morph → 下一状态

循环

所选步骤停留后播放第 2 步

3 步

等待任务状态可以随时切换

idle · blob · 72px E00 · ENTER

复制使用

代码始终与当前预览一致。

第一次使用？

下载并解压到项目中，保留 morph-bot/ 文件夹。

下载 morph-bot.zip ↓

已同步

1 解压组件包到项目

2 粘贴上面的代码

3 打开页面即可看到

需要用 JS 切换状态？查看 API

const bot = document.querySelector("morph-bot");

bot.setState("thinking");
bot.setShape("hex");
await bot.playMorph("send");
await bot.playSequence(sequence);

场景参考

Bot 可以放在哪里？

下面展示按钮、任务卡和页面加载的实际组合方式。progress 是循环动画，不代表真实百分比。

按钮内加载size="18"

正在整理答案通常只需要几秒钟

任务状态state="thinking"

PREPARING WORKSPACE

页面加载shape="pebble"