Back to search
90
MCP live MCP 2025-11-25 streamable-http

網頁動畫工具箱

dev.workers.panda198271.tw-web-motion/web-motion

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

Watch this dependency Share evidence report
Uptime
100.0%
5 direct probes · 30d
Response
503ms
last probe
Tools
8
callable
Resources
0
readable
Prompts
0
available
Primary URL
https://tw-web-motion.panda198271.workers.dev/mcp
Score: 90/100
Handshake verified by our own probe.
pass Answers the MCP handshake 50/50
The handshake and the list calls succeeded on the primary URL.
pass Lists tools, resources or prompts 30/30
8 tools, 0 resources, 0 prompts returned.
pass 3 or more catalogue items 10/10
8 items in total; 3 or more earns these points.
fail Describes itself 0/10
20 characters; more than 30 earns these points.
How to earn +10 points
Describe the server in one or two sentences
Set description in your server.json (or the registry listing) to say what the server does and for whom.

Tools · 8

generate_easing

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

spring_to_css_linear

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

generate_keyframes

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

generate_gradient

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

web_video_ffmpeg

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

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 的授權與適用情境。

How to use

Claude Desktop or claude.ai: add a custom connector (Customize → Connectors; on Team and Enterprise plans an owner adds it under Organization settings → Connectors) with this server URL: https://tw-web-motion.panda198271.workers.dev/mcp

Cursor or Cline: add to your MCP config:

{
  "mcpServers": {
    "\u7db2\u9801\u52d5\u756b\u5de5\u5177\u7bb1": {
      "url": "https://tw-web-motion.panda198271.workers.dev/mcp",
      "transport": "streamable-http"
    }
  }
}