網頁動畫工具箱

dev.workers.panda198271.tw-web-motion由 tw-web-motion.panda198271.workers.dev 发布官方发布者v1.0.0更新于 Oct 24, 2026

CSS 漸層、動畫與網頁互動效果產生器。

已验证Streamable HTTP可网页运行

概览

網頁動畫工具箱 的托管 MCP 服务（tw-web-motion.panda198271.workers.dev），由 tw-web-motion.panda198271.workers.dev 发布；无需登录；Streamable HTTP；8 个工具。

暂无 AI 概览：以下信息来自注册中心条目和服务本身。

发布者
tw-web-motion.panda198271.workers.dev
端点
tw-web-motion.panda198271.workers.dev
最近检查

安装

在 SourceWeft 中

  1. 打开 控制台中的 網頁動畫工具箱，将其添加到工作区。
  2. 为需要使用其工具的对话启用该服务。

Web executable，通过 Streamable HTTP。 远程服务在工作区中配置后即可从网页运行时运行。

交给智能体安装

把这段提示词粘贴到 Claude Code、Codex、Cursor 等智能体，或 SourceWeft 对话中。智能体会读取该服务器的安装指南，先向你展示发布者、端点和登录方式，经你同意后再把它添加到你的客户端。密钥不会写进任何命令。

阅读 https://sourceweft.com/mcp/dev.workers.panda198271.tw-web-motion%2Fweb-motion/install.md，并按其中说明把这个 MCP 服务器接入我的客户端。修改任何配置之前，先告诉我它的发布者、端点和登录方式，等我确认。不要把 API 密钥写进命令或我会提交的文件；问我密钥应从哪里获取。

查看智能体所依据的安装指南

其他 MCP 客户端

把它添加到你客户端的 mcpServers 配置中。

{
  "mcpServers": {
    "dev-workers-panda198271-tw-web-moti-j1t4": {
      "type": "http",
      "url": "https://tw-web-motion.panda198271.workers.dev/mcp"
    }
  }
}

工具

8

generate_easing

產生 CSS cubic-bezier 緩動曲線：用名稱（easeOutCubic、easeInOutBack、materialStandard 等 32 種）或四個控制點，回傳 CSS、Web Animations API 範例與取樣點。

输入参数x1x2y1y2name

spring_to_css_linear

把彈簧物理參數（stiffness、damping、mass）模擬後轉成 CSS linear() 緩動函式與建議時間。

输入参数massdampingstiffness

generate_keyframes

產生 CSS @keyframes 動畫（含減少動態模式）。preset：fadeIn,fadeInUp,fadeInDown,slideInLeft,slideInRight,zoomIn,pulse,bounce,shake,spin,float,heartbeat,flipIn,blurIn,typing

输入参数delayeasingpreset必填durationiterations

generate_gradient

產生 CSS 漸層（linear、radial、conic），可選流動動畫與漸層文字。colors 用逗號分隔 HEX。

输入参数typeanglespeedcolors必填animate

web_video_ffmpeg

產生網頁背景影片壓縮的 ffmpeg 指令（H.264、VP9、AV1、poster）與 HTML video 語法。

输入参数fpsaudioinputwidthoutputquality

animation_browser_support

網頁動畫功能瀏覽器支援版本：View Transitions、捲動驅動動畫、linear()、@starting-style、Web Animations API。

无需输入参数。

animation_a11y_checklist

網頁動畫無障礙與效能檢查清單（WCAG 2.2.2、2.3.1、2.3.3、prefers-reduced-motion、CLS、LCP），附全站減少動態 CSS。

无需输入参数。

compare_animation_libraries

比較網頁動畫工具：CSS、Web Animations API、GSAP、Motion、Anime.js、Lottie、Rive、Three.js、Lenis 的授權與適用情境。

无需输入参数。

版本历史

1
  1. v1.0.0最新Sep 27, 2026

评分

已满足适用检查项的 67%

该评分衡量此收录条目的完整程度，依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价，也不表示服务器安全或当前可用：可连通性是带日期的检查结果，评分也不包含安装量或用户评价。

  • 近 30 天内可连通必需25 分
  • 已声明认证方式必需10 分
  • 已列出工具必需15 分
  • 描述必需15 分

    请在注册中心条目中填写至少 40 个字符的描述。

  • 图标10 分
  • 文档15 分

    请声明包含 README 的 GitHub 仓库，或在 OAuth 受保护资源元数据中提供 resource_documentation。

  • 许可证不适用

    托管服务按其提供方的条款使用，因此这里不要求许可证。此检查项不计入百分比。