用途：在 Web 项目中查找并嵌入与品牌调性一致的动画，支持 Lottie 与 Rive。通过斜杠命令 /animation-design 调用，可带意图参数，例如 /animation-design loading spinner，也可指定 rive 或 lottie。
主要能力：自动检测项目框架（React、Vue、Svelte 或纯 HTML）与已安装动画包；从 DESIGN.md、CSS :root 变量、tailwind.config 等提取品牌色彩与气质，映射为搜索修饰词；按场景推荐 Lottie 或 Rive；搜索并筛选动画，注意文件大小、背景色与单色可重着色性；支持系列动画一致性（优先同一创作者）；生成组件或共享动画配置并标注作者。
使用方式：Lottie 搜索通过 POST https://graphql.lottiefiles.com/ 的 GraphQL 接口查询 searchPublicAnimations，可用 curl 请求并运行 2-4 个搜索变体；网页端 lottiefiles.com 有 Cloudflare 屏蔽，不应 WebFetch。Rive 通过 WebSearch 搜索 site:rive.app。嵌入时按框架安装包：React 用 npm install @lottiefiles/dotlottie-react，Vue 用 @lottiefiles/dotlottie-vue，Svelte 用 @lottiefiles/dotlottie-svelte；Rive 的 React 用 npm install @rive-app/react-webgl2，Vue/Svelte 用 @rive-app/canvas。纯 HTML 的 Lottie 使用 @lottiefiles/lottie-player@2.0.3 与 jsonUrl，Rive 需自托管 .riv 文件到 public/animations/。
适用场景与限制：适合加载指示器、成功/错误反馈、背景装饰、空状态、引导流程，以及需要悬停/点击状态的交互按钮和复杂多状态 UI。Rive 素材比 Lottie 少且无公共 CDN，必须自行托管；Lottie 与 Rive 颜色通常已内嵌，需按调色板筛选；lottie-web 已废弃；纯 HTML 部署应下载 .lottie 解压出 JSON 自托管。具体价格、性能数据等资料暂未提供。