Agent Skills
› nexu-io/motion-anything
nexu-io/motion-anything
GitHub提供基于AnimXYZ的声明式CSS动画技能,通过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的声明式CSS动画技能,通过xyz属性组合淡入、移动、缩放和旋转效果,无需编写关键帧。支持无障碍偏好设置,适用于前端页面元素入场动画实现。
需要为DOM元素添加进场动画
使用声明式方式配置CSS过渡效果
npx skills add nexu-io/motion-anything --skill xyz-fade-big -g -y
提供基于AnimXYZ的声明式CSS动画效果,通过属性组合实现淡入、移动、缩放和旋转等入场动画,无需编写关键帧,支持无障碍访问。
需要为元素添加简单的CSS入场动画
希望使用声明式方式管理前端动效
npx skills add nexu-io/motion-anything --skill xyz-fade-down -g -y
提供声明式动画入口效果,通过xyz属性组合淡入、移动等特效,无需编写关键帧,支持无障碍偏好设置。
需要添加元素入场动画
使用AnimXYZ库进行CSS动画开发
npx skills add nexu-io/motion-anything --skill xyz-fade-left -g -y
提供基于AnimXYZ的声明式CSS动画技能,通过xyz属性实现淡入右移等组合效果,无需编写关键帧。支持无障碍偏好设置,适用于前端界面动效开发。
需要为UI元素添加进入动画
使用AnimXYZ库进行前端动效配置
npx skills add nexu-io/motion-anything --skill xyz-fade-right -g -y
提供声明式入场动画效果,通过xyz属性组合淡入、移动、缩放和旋转,无需编写关键帧。支持无障碍偏好设置,适用于前端UI动效实现。
需要为元素添加淡入小幅度位移动画
希望使用声明式属性替代CSS关键帧实现复杂入场效果
npx skills add nexu-io/motion-anything --skill xyz-fade-small -g -y
基于AnimXYZ的声明式淡入上移动画组件,通过属性配置混合淡入、位移等效果,无需编写关键帧,支持无障碍偏好设置。
需要为元素添加淡入上移动画效果
使用AnimXYZ库实现无关键帧的复合入场动画
npx skills add nexu-io/motion-anything --skill xyz-fade-up -g -y
提供声明式左侧翻转入场动画效果,通过xyz属性组合淡入、移动、缩放和旋转,无需编写关键帧,支持无障碍模式。
需要添加元素进入动画
前端界面动效开发
npx skills add nexu-io/motion-anything --skill xyz-flip-left -g -y
提供基于AnimXYZ的声明式入场动画组件,通过属性组合淡入、位移等效果,无需编写关键帧。支持无障碍模式,适用于前端页面元素动态展示场景。
需要为页面元素添加入场动画
使用声明式方式配置CSS动画
npx skills add nexu-io/motion-anything --skill xyz-flip-up -g -y
提供基于AnimXYZ的声明式CSS动画效果,通过属性组合实现淡入、移动、缩放和旋转等入场动画,无需编写关键帧,支持无障碍访问。
需要为元素添加声明式CSS入场动画
使用AnimXYZ库配置混合动画效果
npx skills add nexu-io/motion-anything --skill xyz-rise-big -g -y
提供基于AnimXYZ的声明式旋转入场动画技能,通过xyz属性组合淡入、移动、缩放和旋转效果,无需编写关键帧,支持无障碍偏好设置。
需要为元素添加旋转入场动画
使用AnimXYZ库实现CSS动画
npx skills add nexu-io/motion-anything --skill xyz-rotate -g -y
提供移动端底部弹窗微交互组件,支持滑入滑出及背景遮罩。遵循无障碍规范并优化性能,适用于按钮、表单等状态变更控件的反馈场景。
需要添加移动端底部弹窗交互
实现符合无障碍标准的UI微动效
npx skills add nexu-io/motion-anything --skill bottom-sheet -g -y
提供按钮按下时的弹性微交互动效,模拟原生触感反馈。适用于改变状态的UI控件,支持减少动态偏好设置,仅使用GPU安全的变换和透明度属性以优化性能。
需要为按钮或表单控件添加点击触觉反馈时
实现移动端App UI的微交互效果时
npx skills add nexu-io/motion-anything --skill button-press -g -y
提供带有弹出动画效果的复选框组件,用于增强App UI微交互反馈。支持无障碍偏好设置,仅对改变状态的控件使用,确保性能与原生体验。
需要为表单控件添加点击反馈动画
实现符合无障碍标准的UI微交互
npx skills add nexu-io/motion-anything --skill checkbox-pop -g -y
提供Material风格的水波纹微交互效果,用于按钮等状态改变控件的点击反馈。支持减少运动偏好设置,仅使用GPU安全的变换和透明度属性以确保性能。
需要为App组件添加原生感的点击反馈
实现符合无障碍标准的微交互动画
npx skills add nexu-io/motion-anything --skill ripple -g -y
提供底部标签栏滑动交互的微组件,用于增强移动端UI反馈。支持无障碍偏好设置,仅对状态改变的控制元素使用,确保性能与原生体验一致。
需要实现底部标签栏滑动效果
为按钮或表单控件添加微交互反馈
npx skills add nexu-io/motion-anything --skill tab-bar-slide -g -y
提供移动端Toast微交互动画,从底部滑入、停留后消失。遵循无障碍规范并优化性能,仅用于状态变更的控件反馈,避免干扰高频操作。
需要为按钮或表单控件添加成功/状态变更反馈
实现符合原生体验的UI微交互
npx skills add nexu-io/motion-anything --skill toast-pop -g -y
提供基于Animate.css的CSS关键帧动画'Back In Down',无需JS即可实现元素入场效果。支持无障碍偏好设置,建议克制使用以避免干扰阅读。
需要为页面元素添加简单的CSS入场动画
前端开发中引入现成的CSS动画库
npx skills add nexu-io/motion-anything --skill anim-backindown -g -y
提供Animate.css的Back In Left CSS关键帧动画,无需JS且支持无障碍设置。用于快速实现元素从左侧进入的视觉效果,建议克制使用以避免干扰阅读。
需要添加CSS入场动画
寻找现成的CSS动效库
npx skills add nexu-io/motion-anything --skill anim-backinleft -g -y
提供基于Animate.css的CSS关键帧动画'Back In Right',无需JS即可实现元素从右侧进入的效果。支持无障碍设置,建议克制使用以避免干扰重要内容阅读。
需要为页面元素添加从右侧滑入的入场动画
希望使用纯CSS实现轻量级动画效果
npx skills add nexu-io/motion-anything --skill anim-backinright -g -y
提供Animate.css的Back In Up CSS关键帧动画,无需JS,支持prefers-reduced-motion。用于快速添加元素入场动画,需克制使用并注意无障碍与许可归属。
需要CSS入场动画
集成Animate.css
npx skills add nexu-io/motion-anything --skill anim-backinup -g -y
提供Animate.css的Back Out Down CSS退出动画,无需JS,支持无障碍设置。适用于元素消失时的下落动画效果,建议适度使用以避免干扰内容阅读。
需要添加CSS退出动画
实现无JS的下落动画效果
npx skills add nexu-io/motion-anything --skill anim-backoutdown -g -y
提供Animate.css的Back Out Left CSS关键帧动画,无需JS即可实现元素退出效果,支持减少运动偏好设置,适用于前端界面动效开发。
需要添加CSS退出动画
前端页面元素动态效果需求
npx skills add nexu-io/motion-anything --skill anim-backoutleft -g -y
提供基于Animate.css的CSS退出动画(Back Out Right),无需JS,支持减少动态偏好设置。用于前端页面元素的平滑退出效果展示。
需要添加CSS退出动画
实现非JavaScript驱动的界面过渡效果
npx skills add nexu-io/motion-anything --skill anim-backoutright -g -y
提供Animate.css的Back Out Up CSS关键帧退出动画,无需JS,支持prefers-reduced-motion。适用于快速添加元素退出效果,需克制使用以保障无障碍体验。
需要为DOM元素添加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的bounceIn CSS关键帧动画,无需JS。支持prefers-reduced-motion无障碍处理,需遵守Hippocratic-2.1许可并添加属性。适用于快速入口动画,建议克制使用。
需要CSS入场动画
实现bounceIn效果
npx skills add nexu-io/motion-anything --skill anim-bouncein -g -y
提供Animate.css中的Bounce In Down CSS关键帧动画,无需JS且支持无障碍偏好设置。用于为元素添加简洁的下落入场效果,建议克制使用以避免干扰重要内容阅读。
需要为页面元素添加CSS下落入场动画
实现无JavaScript依赖的CSS过渡效果
npx skills add nexu-io/motion-anything --skill anim-bounceindown -g -y
提供Animate.css中的Bounce In Left CSS关键帧动画,无需JS且支持无障碍设置。用于为元素添加左侧弹入效果,需合理使用并保留属性声明。
需要CSS入场动画
实现非JS的视觉动效
npx skills add nexu-io/motion-anything --skill anim-bounceinleft -g -y
提供Animate.css中Bounce In Right的CSS关键帧动画实现,无需JS,支持无障碍偏好设置,适用于元素入场动效。
需要添加CSS入场动画
集成Animate.css组件
npx skills add nexu-io/motion-anything --skill anim-bounceinright -g -y
提供Animate.css中的Bounce In Up CSS关键帧动画,无需JS且支持无障碍设置。适用于快速添加元素入场动效,建议克制使用以避免干扰阅读。
需要CSS入场动画
前端UI动效开发
npx skills add nexu-io/motion-anything --skill anim-bounceinup -g -y
提供基于Animate.css的CSS弹出退出动画,无需JS。通过添加class和设置持续时间应用,支持减少运动偏好,需保持克制使用并标注版权。
需要为元素添加CSS退出动画
实现无JavaScript的视觉反馈效果
npx skills add nexu-io/motion-anything --skill anim-bounceout -g -y
提供基于Animate.css的bounceOutDown CSS退出动画,无需JS,支持无障碍偏好设置。用于为元素添加简单的下落消失动效,建议适度使用以保障可读性。
需要为DOM元素添加CSS退出动画
实现无JavaScript依赖的页面过渡效果
npx skills add nexu-io/motion-anything --skill anim-bounceoutdown -g -y
提供CSS关键帧动画Bounce Out Left,无需JS。适用于元素退出时的快速入场效果,支持prefers-reduced-motion无障碍设置,需遵守Animate.css许可并合理使用。
需要添加CSS退出动画
前端页面交互增强
npx skills add nexu-io/motion-anything --skill anim-bounceoutleft -g -y
提供Animate.css的Bounce Out Right CSS关键帧动画,无需JS,支持prefers-reduced-motion。用于元素退出时的快速入场效果,建议克制使用并保留版权标注。
需要添加CSS退出动画
实现无JavaScript的交互动效
npx skills add nexu-io/motion-anything --skill anim-bounceoutright -g -y
提供Animate.css的bounceOutUp CSS退出动画,无需JS,支持减少动态偏好设置。用于快速添加元素消失时的弹跳向上效果,建议克制使用并保留版权信息。
需要为元素添加CSS退出动画
实现无JavaScript的页面过渡效果
npx skills add nexu-io/motion-anything --skill anim-bounceoutup -g -y
提供基于Animate.css的CSS淡入动画实现,无需JS且支持无障碍偏好。适用于快速添加元素入场效果,建议克制使用以保障可访问性。
需要为HTML元素添加CSS淡入动画
寻找无JavaScript依赖的纯CSS过渡效果
npx skills add nexu-io/motion-anything --skill anim-fadein -g -y
提供从Animate.css引入的CSS关键帧动画,实现元素从左下角淡入效果。无需JS,支持无障碍偏好设置,强调克制使用并需保留版权 attribution。
需要添加CSS入场动画
前端页面元素出现动效需求
npx skills add nexu-io/motion-anything --skill anim-fadeinbottomleft -g -y
提供基于Animate.css的CSS关键帧动画,实现元素从右下角淡入效果。无需JS,支持减少运动偏好设置,适用于快速添加入口动画的前端开发场景。
需要为元素添加CSS入场动画
使用Animate.css库进行前端动效开发
npx skills add nexu-io/motion-anything --skill anim-fadeinbottomright -g -y
提供Animate.css的Fade In Down CSS关键帧动画,无需JS且支持无障碍设置。适用于快速添加元素入场效果,建议克制使用以保障可访问性。
需要为页面元素添加淡入下落动画
寻找纯CSS实现的入场过渡效果
npx skills add nexu-io/motion-anything --skill anim-fadeindown -g -y
提供Animate.css的FadeInDownBig入场动画CSS实现,无需JS,支持无障碍设置。用于快速为元素添加从上方大距离淡入的视觉效果,建议克制使用。
需要为页面元素添加CSS入场动画
询问如何引入Animate.css动画类
npx skills add nexu-io/motion-anything --skill anim-fadeindownbig -g -y
提供基于Animate.css的CSS淡入左移动画,无需JS且支持无障碍设置。用于为元素添加入场动效,建议克制使用以避免干扰阅读体验。
需要添加CSS入场动画
实现淡入左移视觉效果
npx skills add nexu-io/motion-anything --skill anim-fadeinleft -g -y
提供基于Animate.css的CSS淡入左移大动画实现,无需JS且支持无障碍偏好设置。适用于快速添加入场动效,建议克制使用以避免干扰重要内容阅读。
需要为元素添加CSS入场动画
前端页面交互效果优化
npx skills add nexu-io/motion-anything --skill anim-fadeinleftbig -g -y
提供基于Animate.css的CSS关键帧动画Fade In Right,无需JS,支持无障碍设置。适用于快速添加入场动画,需保持克制使用并注意版权许可。
需要添加CSS入场动画
前端页面动效开发
npx skills add nexu-io/motion-anything --skill anim-fadeinright -g -y
提供Animate.css中Fade In Right Big的CSS关键帧动画实现,无需JS且支持无障碍偏好设置。用于快速为元素添加从右侧淡入的大幅度入场效果,建议克制使用以保障可读性。
需要为页面元素添加右侧进入的CSS动画
寻找无JavaScript依赖的纯CSS入场特效
npx skills add nexu-io/motion-anything --skill anim-fadeinrightbig -g -y
提供从Animate.css集成的CSS淡入左上角动画,无需JS且支持无障碍设置。用于快速添加元素入场效果,建议克制使用以保障用户体验。
需要为DOM元素添加入场动画
前端页面交互效果优化
npx skills add nexu-io/motion-anything --skill anim-fadeintopleft -g -y
提供基于Animate.css的CSS关键帧动画,实现元素从右上角淡入效果。无需JS,支持无障碍偏好设置,适用于前端页面装饰性入场动效。
需要为DOM元素添加从右上角淡入的CSS动画
寻找轻量级、无JavaScript依赖的CSS入场动画方案
npx skills add nexu-io/motion-anything --skill anim-fadeintopright -g -y
提供基于Animate.css的CSS淡入上移动画实现,无需JS且支持无障碍设置。用于为元素添加入场动画效果,建议适度使用以优化用户体验。
需要添加CSS入场动画
实现无JavaScript的页面元素渐显效果
npx skills add nexu-io/motion-anything --skill anim-fadeinup -g -y
提供Animate.css中Fade In Up Big的CSS关键帧动画实现,无需JS且尊重无障碍设置。适用于快速添加入场动画,建议克制使用以避免干扰核心内容阅读。
需要为元素添加CSS入场动画
寻找无JavaScript依赖的CSS动画方案
npx skills add nexu-io/motion-anything --skill anim-fadeinupbig -g -y
提供基于Animate.css的CSS淡出动画实现,无需JS且支持无障碍偏好设置。适用于快速添加元素退出效果,建议克制使用以避免干扰阅读。
需要为网页元素添加淡出动画
查找现成的CSS关键帧动画方案
npx skills add nexu-io/motion-anything --skill anim-fadeout -g -y
提供基于Animate.css的CSS淡出动画,无需JS。支持无障碍偏好设置,需保留版权信息。适用于快速添加元素退出效果,建议适度使用。
需要CSS元素退出动画
集成Animate.css动画库
npx skills add nexu-io/motion-anything --skill anim-fadeoutbottomleft -g -y


