LogoClawIndex
案例技能关于
LogoClawIndex

ClawIndex

OpenClaw Skills 与 Use Case 索引

ClawIndex 是一个生态驱动的 OpenClaw Skills 与真实 Use Case 索引站。

索引

Skills·
Cases

Meta

关于·
声明·
邮箱·
GitHub
© 2026 ClawIndex 保留所有权利。

motion-ui - 构建具有明确动效的精致界面

使用 Framer Motion 微交互、清晰的界面状态、设计令牌和符合无障碍要求的动画创建现代界面。

标签

更新于: 2026-09-29

能力

典型输入

典型输出

该技能可以做什么

  • 实现富动效界面组件
  • 定义设计令牌
  • 动画化组件状态变化
  • 添加按钮微交互
  • 动画化提示框和模态框
  • 处理加载和成功状态
  • 支持减少动效偏好
  • 验证界面交互状态

输入

  • 组件或页面需求
  • 项目记忆文件
  • 现有设计令牌
  • 组件库规范
  • 无障碍设置

输出

  • 支持动效的界面代码
  • 动画化组件状态
  • 设计令牌定义
  • 无障碍属性
  • 更新后的项目记忆文件

要求

  • Framer Motion
  • CSS 变量
  • Tailwind CSS 或全局 CSS
  • 前端实现环境

来源

  • 规范: SKILL.md
界面动画
Framer Motion
微交互
设计令牌
无障碍
前端
实现富动效界面组件
定义设计令牌
动画化组件状态变化
添加按钮微交互
组件或页面需求
项目记忆文件
现有设计令牌
支持动效的界面代码
动画化组件状态
设计令牌定义