com.penguindriver/motion

up checked 2026-11-11T07:38:17.350Z

Unclaimed · Unverified

Publisher-provided title

網頁動畫工具箱

Publisher-provided description

網頁動畫工具箱：CSS 動畫、easing、影片壓縮與互動設計。台灣繁體中文 MCP 工具。

Summary by lookupd

提供網頁動畫的 CSS 與 easing 產生、無障礙檢查、瀏覽器支援查詢，以及網頁背景影片壓縮指令。

Install

Claude Code, remote (streamable-http)

claude mcp add --transport http motion https://motion.penguindriver.com/mcp

Codex, remote (streamable-http)

codex mcp add motion --url https://motion.penguindriver.com/mcp

Cursor, remote (streamable-http) → .cursor/mcp.json

{
  "mcpServers": {
    "motion": {
      "url": "https://motion.penguindriver.com/mcp"
    }
  }
}

Other clients: docs. Or tell your agent: Set up lookupd for me: read https://lookupd.com/agent.md and follow it.

Publisher-provided text

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

Shows this live status and links here; updates hourly.

[![lookupd status](https://lookupd.com/badge/com.penguindriver/motion.svg)](https://lookupd.com/servers/com.penguindriver/motion)