網頁動畫工具箱
重點摘要：網頁動畫工具箱提供 8 個免費工具：32 種 cubic-bezier easing、彈簧轉 CSS linear()、15 種關鍵影格、流動漸層、背景影片 ffmpeg 指令、9 項動畫 API 瀏覽器支援表、無障礙清單與 9 種函式庫比較，不用註冊。
做動態網頁、互動設計常用的產生器，即時預覽、一鍵複製 CSS。全部免費、不用註冊，產生的程式碼都已處理「減少動態」模式。
Easing 曲線產生器cubic-bezier 拖曳調整，32 種常用曲線
彈簧動畫 → CSS linear()設定剛性、阻尼，轉成純 CSS 彈簧
關鍵影格動畫產生器淡入、彈跳、搖晃、脈動等 15 種
漸層與流動漸層線性、放射、圓錐、會動的背景漸層
背景影片壓縮指令H.264、VP9、AV1 的 ffmpeg 指令與 HTML
動畫 API 瀏覽器支援View Transitions、捲動驅動動畫等
動畫無障礙與效能WCAG 規範、減少動態、不掉格
動畫函式庫比較GSAP、Motion、Lottie、Rive、Three.js
常見問題
網頁動畫工具箱產生的程式碼可以商用嗎？
可以。本站產生的 CSS、HTML 與指令可自由使用於商業專案；瀏覽器支援與函式庫授權資料整理於 2026-09-26，上線前請以官方文件為準。
產生的動畫有處理減少動態模式嗎？
有。關鍵影格、流動漸層與背景影片的程式碼都已加上 prefers-reduced-motion: reduce 的處理，使用者在系統開啟減少動態時會關閉或停止動畫。
AI 或程式可以直接呼叫這些工具嗎？
可以。本站提供免註冊的 JSON API 與 MCP 端點（POST /mcp），共 8 個 MCP 工具，涵蓋 easing、彈簧、關鍵影格、漸層、影片指令、瀏覽器支援、無障礙與函式庫比較。