Agent Skills
› nexu-io/motion-anything
nexu-io/motion-anything
GitHub提供基于AnimXYZ的声明式入场动画技能,通过xyz属性组合淡入、移动、缩放和旋转效果,无需编写关键帧。支持无障碍偏好设置,适用于前端页面动效开发。
Install All Skills
npx skills add nexu-io/motion-anything --all -g -y
Skills in Collection (230)
Showing top 50 of 230 by quality score. Use the install list command or open individual skills for the rest.
提供基于AnimXYZ的声明式入场动画技能,通过xyz属性组合淡入、移动、缩放和旋转效果,无需编写关键帧。支持无障碍偏好设置,适用于前端页面动效开发。
需要为元素添加声明式入场动画
希望避免手动编写CSS关键帧
使用AnimXYZ库进行前端动效开发
npx skills add nexu-io/motion-anything --skill xyz-fade-big -g -y
提供基于AnimXYZ的声明式淡入下移动画效果,通过属性配置实现混合动效,无需编写关键帧,支持无障碍访问并尊重用户偏好。
需要为元素添加淡入下移动画
使用AnimXYZ库进行CSS动画配置
npx skills add nexu-io/motion-anything --skill xyz-fade-down -g -y
提供基于 AnimXYZ 的声明式淡入左移动画效果,通过属性配置实现混合动效,无需编写关键帧,支持无障碍模式。
需要为 UI 元素添加入场动画
希望使用声明式方式管理 CSS 动画
npx skills add nexu-io/motion-anything --skill xyz-fade-left -g -y
AnimXYZ的淡入右移入场动画技能,通过声明式属性实现无关键帧混合效果,支持可访问性设置。
需要添加元素入场动画
使用AnimXYZ库进行UI动效开发
npx skills add nexu-io/motion-anything --skill xyz-fade-right -g -y
提供基于AnimXYZ的声明式淡入动画效果,支持混合淡入、移动、缩放和旋转,无需编写关键帧,自动尊重用户减少动效偏好。
需要为元素添加淡入入场动画
使用xyz属性配置复合动画效果
npx skills add nexu-io/motion-anything --skill xyz-fade-small -g -y
基于AnimXYZ的声明式CSS动画技能,通过xyz属性实现淡入上移等复合入场效果,无需编写关键帧,支持无障碍偏好设置。
需要为元素添加淡入上移等复合入场动画
使用AnimXYZ库进行前端UI动效开发
npx skills add nexu-io/motion-anything --skill xyz-fade-up -g -y
提供声明式动画入口效果,通过组合淡入、移动、缩放和旋转实现无关键帧的 Flip Left 动画。支持无障碍偏好设置,适用于前端 UI 动效开发。
需要添加页面元素入场动画
使用 AnimXYZ 库进行 CSS 动画配置
npx skills add nexu-io/motion-anything --skill xyz-flip-left -g -y
提供基于AnimXYZ的声明式翻转入场动画,通过xyz属性组合淡入、移动等效果,无需编写关键帧,支持无障碍偏好并遵循MIT协议。
需要添加元素入场动画
使用AnimXYZ库实现声明式动画
npx skills add nexu-io/motion-anything --skill xyz-flip-up -g -y
提供基于AnimXYZ的声明式CSS动画效果,通过xyz属性组合淡入、移动、缩放和旋转,无需编写关键帧。支持响应式偏好设置,适用于前端元素入场动效。
需要为DOM元素添加复合入场动画
希望使用声明式属性替代CSS关键帧实现动效
npx skills add nexu-io/motion-anything --skill xyz-rise-big -g -y
AnimXYZ的Rotate In技能,通过xyz属性声明式实现淡入、移动、缩放和旋转组合动画,无需编写关键帧,尊重用户减少动态偏好。
需要为元素添加声明式入场动画
使用AnimXYZ库进行CSS动画配置
npx skills add nexu-io/motion-anything --skill xyz-rotate -g -y
提供底部抽屉微交互组件规范,用于App UI反馈。支持无障碍模式,仅对改变状态的控件使用,确保性能与原生体验。
实现移动端底部弹出层交互
处理UI微交互动画规范
npx skills add nexu-io/motion-anything --skill bottom-sheet -g -y
提供按钮按压的弹性微交互效果,模拟原生触感反馈。适用于改变状态的UI控件,支持减少运动偏好设置,确保GPU安全的性能优化。
需要为按钮或表单控件添加点击反馈
实现符合无障碍标准的微交互动画
npx skills add nexu-io/motion-anything --skill button-press -g -y
提供带微交互效果的复选框组件,点击时产生弹出及绘制勾选动画。适用于移动端控件反馈,支持减少动态偏好设置,仅用于状态改变的控件,兼顾性能与无障碍访问。
需要实现复选框点击动画效果
构建具有原生反馈感的App UI组件
npx skills add nexu-io/motion-anything --skill checkbox-pop -g -y
提供符合 Material Design 风格的触摸涟漪微交互效果,支持 prefers-reduced-motion 无障碍设置,仅用于状态改变的控件以提升用户体验。
需要为按钮或表单控件添加点击反馈
实现移动端 UI 的微交互动画
npx skills add nexu-io/motion-anything --skill ripple -g -y
提供底部标签栏的滑动交互效果,增强移动端组件反馈。支持无障碍模式,仅使用 GPU 安全的属性,确保性能与原生体验一致。
需要实现底部标签栏切换动画
为 App 组件添加微交互动效
npx skills add nexu-io/motion-anything --skill tab-bar-slide -g -y
用于移动端应用UI的微交互组件,提供从底部滑入、停留后消失的Toast反馈效果。适用于按钮等状态变更控件,支持无障碍偏好设置,仅使用GPU安全的变换和透明度属性以优化性能。
需要为UI控件添加状态变更反馈
实现符合无障碍标准的微交互动画
npx skills add nexu-io/motion-anything --skill toast-pop -g -y
提供 Back In Down CSS 关键帧动画,源自 Animate.css。无需 JS,支持 prefers-reduced-motion,适用于快速页面元素入场效果,建议克制使用并保留版权标注。
需要添加 CSS 入场动画
前端 UI 动效开发
npx skills add nexu-io/motion-anything --skill anim-backindown -g -y
提供Animate.css的Back In Left CSS关键帧动画,无需JS,支持无障碍设置。用于快速实现元素从左侧进入的视觉效果,需控制使用频率并遵守许可协议。
需要添加CSS入场动画
前端页面交互效果优化
npx skills add nexu-io/motion-anything --skill anim-backinleft -g -y
提供基于 Animate.css 的 CSS 关键帧动画 'Back In Right',无需 JS。支持 prefers-reduced-motion 无障碍设置,需保留版权信息并克制使用。
需要添加 CSS 入场动画
前端页面动效实现
npx skills add nexu-io/motion-anything --skill anim-backinright -g -y
提供Animate.css的Back In Up CSS关键帧动画,无需JS,支持无障碍偏好。用于快速添加元素入场动画,需克制使用并遵守许可协议。
需要CSS入场动画
前端UI动效开发
npx skills add nexu-io/motion-anything --skill anim-backinup -g -y
提供 Animate.css 的 Back Out Down CSS 退出动画,无需 JS。支持 prefers-reduced-motion,需注明版权。用于快速添加元素退出效果,建议克制使用。
需要为元素添加退出动画
寻找现成的 CSS 关键帧动画
npx skills add nexu-io/motion-anything --skill anim-backoutdown -g -y
提供Animate.css的backOutLeft CSS退出动画,无需JS,支持无障碍设置。适用于快速添加元素左退场效果,建议克制使用并保留版权信息。
需要CSS关键帧动画
实现元素退出效果
集成Animate.css
npx skills add nexu-io/motion-anything --skill anim-backoutleft -g -y
提供基于Animate.css的Back Out Right CSS退出动画,无需JS,支持减少运动偏好设置。
需要为元素添加CSS退出动画
寻找无JavaScript依赖的CSS关键帧动画
npx skills add nexu-io/motion-anything --skill anim-backoutright -g -y
提供Animate.css的backOutUp CSS关键帧退出动画,无需JS。适用于快速元素退出效果,需控制使用频率并尊重无障碍偏好。
需要添加CSS退出动画
实现无JavaScript的视觉反馈
npx skills add nexu-io/motion-anything --skill anim-backoutup -g -y
提供基于 Animate.css 的 CSS 弹跳动画实现,无需 JS,支持减少运动偏好设置。用于快速为元素添加强调动画效果,需保持克制使用并保留版权信息。
需要添加 CSS 动画
前端界面动效需求
npx skills add nexu-io/motion-anything --skill anim-bounce -g -y
提供 Animate.css 的 Bounce In CSS 关键帧动画,无需 JS。支持 prefers-reduced-motion 无障碍访问,需遵守许可并克制使用。
需要添加 CSS 入场动画
前端 UI 动效开发
npx skills add nexu-io/motion-anything --skill anim-bouncein -g -y
提供Animate.css的bounceInDown CSS关键帧动画,无需JS,支持prefers-reduced-motion。用于快速添加CSS入场动画,需克制使用并保留版权信息。
需要为元素添加CSS下落弹跳动画
询问如何应用animate.css动画
npx skills add nexu-io/motion-anything --skill anim-bounceindown -g -y
提供基于 Animate.css 的 bounceInLeft CSS 关键帧动画,无需 JS。支持 prefers-reduced-motion 无障碍访问,需保留版权署名并克制使用。
需要添加 CSS 入场动画
寻找现成的 CSS 动画代码片段
npx skills add nexu-io/motion-anything --skill anim-bounceinleft -g -y
提供 Animate.css 的 Bounce In Right CSS 关键帧动画,无需 JS。支持 prefers-reduced-motion,需遵守许可并合理使用。
需要添加 CSS 入场动画
前端 UI 动效开发
npx skills add nexu-io/motion-anything --skill anim-bounceinright -g -y
提供基于Animate.css的bounceInUp CSS关键帧动画,无需JS且支持无障碍设置。用于为元素添加入场动画效果,建议适度使用以保障用户体验。
需要添加CSS入场动画
前端页面动效开发
npx skills add nexu-io/motion-anything --skill anim-bounceinup -g -y
提供Animate.css的Bounce Out CSS关键帧退出动画,无需JS,支持无障碍设置。用于快速为元素添加弹性退出效果,需克制使用并保留版权信息。
需要CSS退出动画
实现bounceOut效果
npx skills add nexu-io/motion-anything --skill anim-bounceout -g -y
提供Animate.css的bounceOutDown CSS关键帧退出动画,无需JS,支持无障碍偏好设置。
需要为元素添加CSS退出动画
实现非JavaScript的页面过渡效果
npx skills add nexu-io/motion-anything --skill anim-bounceoutdown -g -y
提供Animate.css的Bounce Out Left CSS关键帧动画,无需JS。用于快速实现元素退出效果,支持无障碍偏好设置,需保留版权信息并克制使用。
需要添加CSS退出动画
前端UI动效开发
npx skills add nexu-io/motion-anything --skill anim-bounceoutleft -g -y
提供基于 Animate.css 的 CSS 退出动画 Bounce Out Right,无需 JS,支持无障碍偏好设置。
需要添加元素退出动画
前端 UI 动效开发
npx skills add nexu-io/motion-anything --skill anim-bounceoutright -g -y
提供Animate.css的bounceOutUp CSS关键帧退出动画,无需JS。支持prefers-reduced-motion无障碍设置,需保留版权信息并克制使用。
需要添加CSS退出动画
前端页面元素消失动效需求
npx skills add nexu-io/motion-anything --skill anim-bounceoutup -g -y
提供基于 Animate.css 的 CSS Fade In 入场动画,无需 JS。支持 prefers-reduced-motion 无障碍设置,需注明版权并克制使用。
需要添加 CSS 淡入动画
实现无 JavaScript 的页面元素入场效果
npx skills add nexu-io/motion-anything --skill anim-fadein -g -y
提供基于Animate.css的CSS关键帧动画fadeInBottomLeft,无需JS且支持无障碍设置,用于快速实现元素从左下角淡入效果。
需要添加CSS入场动画
前端UI动效开发
npx skills add nexu-io/motion-anything --skill anim-fadeinbottomleft -g -y
提供基于Animate.css的CSS关键帧动画,实现元素从右下角淡入效果。无需JS,支持减少运动偏好设置,适用于前端UI增强。
需要添加CSS入场动画
实现元素从右下角淡入效果
npx skills add nexu-io/motion-anything --skill anim-fadeinbottomright -g -y
提供Animate.css的Fade In Down CSS关键帧动画,无需JS。支持prefers-reduced-motion无障碍特性。适用于快速添加元素入场动画,建议克制使用以避免干扰重要内容阅读。
需要CSS入场动画
实现淡入向下效果
npx skills add nexu-io/motion-anything --skill anim-fadeindown -g -y
提供CSS关键帧入场动画Fade In Down Big,无需JS且尊重无障碍设置。用于快速为元素添加下降淡入效果,需克制使用并保留版权信息。
需要为网页元素添加CSS入场动画
寻找现成的Animate.css动画实现
npx skills add nexu-io/motion-anything --skill anim-fadeindownbig -g -y
提供基于Animate.css的CSS淡入左动画,无需JS。通过添加类名和设置持续时间快速实现元素入场效果,支持无障碍偏好设置并保留版权信息。
需要为UI元素添加CSS入场动画
寻找轻量级无JS的CSS动画方案
npx skills add nexu-io/motion-anything --skill anim-fadeinleft -g -y
提供Animate.css中Fade In Left Big动画的CSS实现指南,支持无障碍偏好设置。
需要添加CSS入场动画
前端页面动效开发
npx skills add nexu-io/motion-anything --skill anim-fadeinleftbig -g -y
提供基于Animate.css的CSS淡入右移动画实现,无需JS,支持减少运动偏好设置。适用于快速添加元素入场动画,建议克制使用以保障可访问性。
需要为页面元素添加淡入右移动画效果
询问如何使用无JavaScript的CSS动画
npx skills add nexu-io/motion-anything --skill anim-fadeinright -g -y
提供Animate.css的Fade In Right Big入场动画CSS实现,无需JS,支持无障碍偏好设置。适用于快速添加元素进入效果,建议克制使用以避免干扰核心内容阅读。
需要为页面元素添加从右侧大距离淡入的视觉效果
前端开发中引入CSS关键帧动画以增强用户体验
npx skills add nexu-io/motion-anything --skill anim-fadeinrightbig -g -y
提供基于Animate.css的CSS关键帧淡入左上角动画,无需JS且尊重无障碍设置。用于快速添加元素入场效果,建议克制使用以避免干扰主要内容。
需要为元素添加CSS入场动画
实现无JavaScript的视觉动效
npx skills add nexu-io/motion-anything --skill anim-fadeintopleft -g -y
提供基于Animate.css的CSS关键帧入场动画,无需JS。支持 prefers-reduced-motion 无障碍设置,需保留版权信息并克制使用。
需要添加CSS入场动画
前端UI动效实现
npx skills add nexu-io/motion-anything --skill anim-fadeintopright -g -y
提供基于Animate.css的CSS淡入上移动画技能,无需JS且支持无障碍设置。适用于快速添加元素入场动效,建议克制使用以避免干扰重要内容阅读。
需要为网页元素添加无JavaScript的入场动画
前端开发中集成Animate.css风格的CSS关键帧动画
npx skills add nexu-io/motion-anything --skill anim-fadeinup -g -y
提供Animate.css的Fade In Up Big CSS关键帧动画,无需JS且支持无障碍偏好。用于快速实现元素入场动画,建议克制使用并保留版权信息。
需要CSS入场动画
前端UI动效需求
npx skills add nexu-io/motion-anything --skill anim-fadeinupbig -g -y
提供基于 Animate.css 的 CSS 淡出动画技能,无需 JS 即可实现元素退出效果。支持 prefers-reduced-motion 无障碍访问,需保留版权属性并克制使用。
需要为页面元素添加淡出退出动画
前端开发中引入无 JS 依赖的 CSS 关键帧动画
npx skills add nexu-io/motion-anything --skill anim-fadeout -g -y
提供基于 Animate.css 的 CSS 关键帧动画 fadeOutBottomLeft,无需 JS。支持无障碍偏好设置,强调克制使用并保留版权署名。
需要添加 CSS 退出动画
寻找无 JavaScript 的页面过渡效果
npx skills add nexu-io/motion-anything --skill anim-fadeoutbottomleft -g -y


