Transitions.dev：AI 可调用的 UI 转场库

是什么 Transitions.dev 是面向 Web 开发者的 UI 转场素材库。原推文宣布 Pro package 新增转场，站点按 Essential、AI Agents、Effects、Texts、Pro 等方向整理案例，并提供可复制的 CSS、React 代码，也能以 skill 形式交给 Claude、Cursor、Codex 或 Refine 使用。

核心设计 它把抽象动效包装成明确的交互结果：加号液态裂变成操作扇面，拖放区域形变为图片，spinner 变成完成勾，图片碎裂后化为烟雾，文字则通过 shimmer 或渐变流动建立状态感。价值不只是视觉装饰，而是为菜单、加载、成功、删除、文本反馈等常见状态提供可复用的动效范式。

关键洞察 页面还强调动效性能取决于属性是否进入 paint path。mask-position 会触发重绘，叠加 displacement filter 后可能让 CPU 每帧重复执行滤镜；用静态背景加同色遮罩，再通过 transform 移动遮罩，是更容易合成的替代方案。

边界与风险 Pro 内容存在访问与授权边界，AI 生成的代码仍需结合真实布局、触摸设备和无障碍要求验证。物理、模糊、滤镜和烟雾效果也应控制复杂度，避免为了短暂惊喜牺牲响应速度与可读性。