LottieFiles MCP Server

概述

LottieFiles MCP 服务器（常简称为“Lottie MCP”）是一个轻量级、开源的**模型上下文协议（MCP）**服务器，它将 AI 智能体与 LottieFiles 平台上庞大的 Lottie 动画库连接起来。它让大型语言模型和 AI 编程助手能够在不离开对话或构建自定义 API 集成的情况下，发现、预览元数据并获取高质量的矢量动画。

Lottie 是一种流行的基于矢量的动画开放格式，最初由 Airbnb 创建，广泛应用于网页、移动端和 UI/UX 设计中。这个 MCP 服务器将整个 LottieFiles 目录作为工具提供给 AI 代理工作流使用。

功能特性

• 搜索 Lottie 动画：使用关键词或描述查询 LottieFiles 数据库。
• 获取动画详情：检索全面的元数据，包括 JSON 结构信息、作者、下载量、分类和预览 URL。
• 热门动画列表：获取趋势性或高评分的 Lottie 文件，快速获取灵感。
• 符合 MCP 标准：完全兼容任何 MCP 客户端，包括 Claude Desktop、Cursor、VS Code 扩展等。
• 简易安装：支持通过 Smithery 或 npm 一键安装。

使用场景

• AI 驱动的动效设计：让 Claude 或 Cursor 搜索现有的 Lottie 动画，并将其融入 UI 原型、网站或应用中。
• 快速原型制作：代理可以在代码生成过程中找到合适的加载动画、图标、插图或复杂的 UI 动画。
• 设计系统自动化：将 Lottie 资源集成到生成的 React、Flutter 或网页项目中，并附带正确的元数据。
• 创意工作流：结合 Lottie Creator 自身的 MCP 桥接工具，实现端到端的动画生成与编辑。
• 教育与探索：AI 助手可以通过实时拉取真实示例来讲解和演示 Lottie 动画。

安装与配置

通过 Smithery 安装（推荐用于 Claude Desktop）

npx -y smithery install mcp-server-lottiefiles --client claude

手动安装

npm install -g mcp-server-lottiefiles
# 或克隆仓库并本地运行

安装完成后，配置你的 MCP 兼容客户端（Claude、Cursor 等）以连接到该服务器。服务器可本地运行或远程托管，并提供标准化的工具来搜索和获取动画。

工作原理

1. 你的 AI 代理（通过 MCP）向服务器发送搜索查询。
2. 服务器查询 LottieFiles 的公共 API。
3. 结果以 AI 可理解并采取行动的结构化格式返回（例如，下载 URL、JSON 数据、预览）。
4. AI 随后可以在生成的代码或设计中引用、嵌入或修改动画。

这使得 AI 上下文丰富且工具增强，而无需模型内建数千种资源的知识。

相关工具

• Lottie Creator MCP 桥接器: LottieFiles 官方集成方案，允许 AI 代理直接在 Lottie Creator 编辑器中读取、编辑图层及生成动画变体。
• 更广泛的 Lottie 生态系统，包括 lottie-web、lottie-react 及 dotLottie 格式。

LottieFiles MCP 服务器处于积极维护状态，并已收录于 Smithery、MCP.so、PulseMCP 等主流 MCP 目录平台。