Agent Skills › nexu-io/motion-anything

nexu-io/motion-anything

GitHub

提供声明式入场动画效果,通过xyz属性组合淡入、移动、缩放和旋转,无需编写关键帧。支持无障碍偏好设置,适用于前端UI动效开发。

230 skills 652

Install All Skills

npx skills add nexu-io/motion-anything --all -g -y
More Options

List skills in collection

npx skills add nexu-io/motion-anything --list

Skills in Collection (230)

Showing top 50 of 230 by quality score. Use the install list command or open individual skills for the rest.

提供声明式入场动画效果,通过xyz属性组合淡入、移动、缩放和旋转,无需编写关键帧。支持无障碍偏好设置,适用于前端UI动效开发。
需要添加元素入场动画 使用AnimXYZ库进行CSS动画声明
recipes/animxyz/xyz-fade-big/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-fade-big -g -y
提供基于AnimXYZ的声明式CSS动画技能,通过xyz属性实现淡入下移效果,无需编写关键帧,支持组合移动、缩放和旋转,并尊重用户减少动态偏好设置。
需要为元素添加淡入下移入场动画 使用AnimXYZ库进行声明式UI动效开发
recipes/animxyz/xyz-fade-down/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-fade-down -g -y
AnimXYZ的Fade Left声明式入场动画技能,通过xyz属性组合淡入移动缩放旋转,无需编写关键帧,支持无障碍偏好设置。
需要添加元素淡入左侧动画效果 使用AnimXYZ库进行声明式CSS动画配置
recipes/animxyz/xyz-fade-left/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-fade-left -g -y
提供基于AnimXYZ的声明式淡入右移动画技能,通过xyz属性组合渐变、位移等效果,无需编写关键帧,支持无障碍偏好设置。
需要为元素添加淡入右移动画 使用AnimXYZ库进行CSS动画开发
recipes/animxyz/xyz-fade-right/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-fade-right -g -y
提供基于AnimXYZ的声明式CSS动画技能,通过xyz属性组合淡入、位移、缩放和旋转效果,无需编写关键帧,支持无障碍偏好设置。
需要为元素添加入场动画 使用声明式方式配置CSS过渡效果
recipes/animxyz/xyz-fade-small/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-fade-small -g -y
提供基于AnimXYZ的声明式淡入上移动画技能,通过属性配置组合位移、缩放和旋转效果,无需编写关键帧,支持无障碍偏好设置。
需要为元素添加淡入上移动画 使用AnimXYZ库实现CSS动画
recipes/animxyz/xyz-fade-up/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-fade-up -g -y
提供AnimXYZ声明式入场动画配置,通过xyz属性组合淡入、位移等效果,无需编写关键帧。支持无障碍模式,适用于前端UI动效实现。
需要为元素添加左侧翻转入场动画 使用AnimXYZ库实现声明式CSS动画
recipes/animxyz/xyz-flip-left/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-flip-left -g -y
提供基于AnimXYZ的声明式翻转入场动画技能,支持混合淡入、移动等效果,无需编写关键帧。
需要添加元素入场动画 使用AnimXYZ库实现UI动效
recipes/animxyz/xyz-flip-up/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-flip-up -g -y
基于AnimXYZ的声明式CSS动画技能,通过xyz属性组合淡入、位移、缩放和旋转效果,无需编写关键帧,支持减少运动偏好设置。
需要添加页面元素入场动画 使用AnimXYZ库实现组合动效
recipes/animxyz/xyz-rise-big/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-rise-big -g -y
提供基于AnimXYZ的声明式旋转入场动画技能,支持组合淡入、移动、缩放和旋转效果,无需编写关键帧,尊重用户减少运动偏好。
需要为元素添加旋转入场动画 使用AnimXYZ实现组合动画效果
recipes/animxyz/xyz-rotate/SKILL.md
npx skills add nexu-io/motion-anything --skill xyz-rotate -g -y
提供底部弹窗微交互组件,用于移动端UI反馈。支持无障碍偏好及GPU优化性能,适用于按钮、表单等状态变更控件,遵循运动规范。
实现底部弹出层效果 添加移动端微交互动画
recipes/app/bottom-sheet/SKILL.md
npx skills add nexu-io/motion-anything --skill bottom-sheet -g -y
提供按钮按下时的弹簧回弹微交互效果,模拟原生触感反馈。适用于改变状态的UI控件,支持减少运动偏好设置,仅使用变换和透明度以确保GPU性能安全。
需要为按钮或表单控件添加点击触觉反馈时 实现符合无障碍标准的移动端微交互组件时
recipes/app/button-press/SKILL.md
npx skills add nexu-io/motion-anything --skill button-press -g -y
提供复选框点击时的弹出及绘制勾选动画效果,适用于App UI微交互。支持减少运动偏好设置,仅使用GPU安全的变换和透明度属性,确保性能与无障碍访问。
需要为复选框添加状态切换动画 实现移动端组件的反馈微交互
recipes/app/checkbox-pop/SKILL.md
npx skills add nexu-io/motion-anything --skill checkbox-pop -g -y
提供符合 Material Design 风格的触摸反馈微交互效果,支持 GPU 加速与无障碍偏好设置,适用于按钮等状态变更控件。
需要添加点击涟漪反馈的 UI 组件开发 实现符合无障碍标准的动效交互
recipes/app/ripple/SKILL.md
npx skills add nexu-io/motion-anything --skill ripple -g -y
提供底部标签栏的滑动激活指示器微交互,支持无障碍模式。用于按钮、表单等组件的状态反馈,强调性能与克制使用。
需要实现移动端原生感的UI微交互 为TabBar或按钮添加状态切换动画
recipes/app/tab-bar-slide/SKILL.md
npx skills add nexu-io/motion-anything --skill tab-bar-slide -g -y
提供移动端UI微交互动效,实现Toast从底部滑入、停留后淡出的效果。支持无障碍设置,仅使用GPU加速属性优化性能,适用于状态变更控件的反馈场景。
需要为按钮或表单控件添加操作反馈动效 实现符合无障碍标准的滑动消失提示组件
recipes/app/toast-pop/SKILL.md
npx skills add nexu-io/motion-anything --skill toast-pop -g -y
提供基于Animate.css的CSS关键帧动画'Back In Down',无需JS即可实现元素进入效果。支持无障碍偏好设置,建议克制使用以避免干扰阅读。
需要为页面元素添加CSS入场动画 寻找无JavaScript依赖的纯CSS动画方案
recipes/css/anim-backindown/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backindown -g -y
提供Animate.css的Back In Left CSS关键帧动画,无需JS。用于实现元素从左侧进入的入场效果,支持无障碍偏好设置,需遵守许可协议并保持克制使用。
需要CSS入场动画 添加左侧滑入效果
recipes/css/anim-backinleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backinleft -g -y
提供基于Animate.css的Back In Right CSS关键帧动画,无需JS且支持无障碍偏好设置。适用于快速实现元素从右侧进入的视觉效果,需合理使用并保留版权信息。
需要添加CSS入场动画 使用Animate.css动画库
recipes/css/anim-backinright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backinright -g -y
提供Animate.css中的Back In Up CSS关键帧动画,无需JS即可实现元素向上入场效果。支持prefers-reduced-motion无障碍设置,需保留版权声明。
需要添加CSS入场动画 前端页面动效开发
recipes/css/anim-backinup/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backinup -g -y
提供Animate.css的Back Out Down CSS关键帧退出动画,无需JS,支持减少运动偏好。通过添加类名快速实现元素下落消失效果,需控制使用频率并保留版权 attribution。
需要CSS退出动画 集成Animate.css动画
recipes/css/anim-backoutdown/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backoutdown -g -y
提供CSS关键帧退出动画,无需JS。通过添加类名应用,支持无障碍设置,建议克制使用以保障可读性。
需要元素向左退出动画 前端UI动效开发
recipes/css/anim-backoutleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backoutleft -g -y
提供基于Animate.css的Back Out Right CSS退出动画,无需JS。支持prefers-reduced-motion无障碍设置,需保留版权信息并克制使用。
需要添加CSS元素退出动画 寻找现成的CSS关键帧动画
recipes/css/anim-backoutright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backoutright -g -y
提供Back Out Up CSS关键帧退出动画,无需JS。支持减少动态偏好设置,需保持克制使用并标注Animate.css版权。
需要添加CSS元素退出动画 实现无JavaScript的CSS过渡效果
recipes/css/anim-backoutup/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-backoutup -g -y
提供Animate.css的Bounce CSS关键帧动画,无需JS且尊重无障碍设置。适用于快速添加强调效果,建议克制使用以避免干扰主要内容阅读。
需要为元素添加CSS弹跳动画 前端开发中引入非JavaScript动画
recipes/css/anim-bounce/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounce -g -y
提供 Bounce In CSS 关键帧动画,源自 Animate.css。无需 JS,直接添加类名即可实现元素弹入效果。支持 prefers-reduced-motion 无障碍设置,建议克制使用以避免干扰主要内容阅读。
需要为页面元素添加入场动画 寻找纯 CSS 的 bounce 效果
recipes/css/anim-bouncein/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bouncein -g -y
提供 CSS 弹跳进入动画,无需 JS。支持减少动态偏好设置,需保留版权信息。适用于快速添加入场效果,避免在重要内容或大量使用时滥用。
需要为元素添加 CSS 入场动画 实现无 JavaScript 的视觉动效
recipes/css/anim-bounceindown/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceindown -g -y
提供Animate.css中的bounceInLeft CSS关键帧动画,无需JS。指导如何复制CSS并添加类名应用入场动画,强调克制使用以保障可访问性并遵守许可协议。
需要为元素添加左侧弹入的CSS动画效果 寻找现成的、无JavaScript依赖的CSS入场动画方案
recipes/css/anim-bounceinleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceinleft -g -y
提供基于Animate.css的bounceInRight CSS关键帧动画,无需JS且支持无障碍设置。用于为元素添加右侧弹入效果,建议克制使用并保留版权信息。
需要CSS入场动画 前端UI动效实现
recipes/css/anim-bounceinright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceinright -g -y
提供基于Animate.css的bounceInUp CSS关键帧动画,无需JS且支持无障碍偏好设置。用于为元素添加优雅的入场动效,建议克制使用以避免干扰阅读。
需要为UI元素添加CSS入场动画 寻找无JavaScript依赖的CSS动画方案
recipes/css/anim-bounceinup/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceinup -g -y
提供Animate.css的Bounce Out CSS退出动画,无需JS。支持prefers-reduced-motion无障碍设置,需遵守许可证并合理使用以避免干扰内容阅读。
需要CSS退出动画 实现非JavaScript交互动画
recipes/css/anim-bounceout/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceout -g -y
提供Animate.css的bounceOutDown CSS关键帧动画,无需JS。用于元素退出时的下落弹跳效果,支持prefers-reduced-motion无障碍适配,需保留版权署名并适度使用。
需要为DOM元素添加CSS退出动画 实现非JavaScript的纯CSS下落弹跳效果
recipes/css/anim-bounceoutdown/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceoutdown -g -y
提供 Bounce Out Left CSS 关键帧退出动画,源自 Animate.css。无需 JS,直接添加类名即可使用。支持 prefers-reduced-motion 无障碍特性,需保留版权引用并克制使用。
需要为元素添加左侧弹跳退出动画 寻找纯 CSS 实现的轻量级页面过渡效果
recipes/css/anim-bounceoutleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceoutleft -g -y
提供基于Animate.css的CSS关键帧退出动画(Bounce Out Right),无需JS,支持无障碍设置,用于前端UI交互效果。
需要添加元素退出动画 寻找纯CSS动画方案
recipes/css/anim-bounceoutright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceoutright -g -y
提供基于Animate.css的CSS弹出向上动画,无需JS。支持无障碍偏好设置,需保留版权信息并克制使用。
需要添加CSS退出动画 前端页面动效开发
recipes/css/anim-bounceoutup/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-bounceoutup -g -y
提供基于Animate.css的CSS淡入动画实现,无需JS且支持无障碍设置。适用于快速添加元素入场效果,建议适度使用以避免干扰主要内容阅读。
需要为HTML元素添加CSS淡入动画 前端开发中引入无JavaScript依赖的入场动效
recipes/css/anim-fadein/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadein -g -y
提供基于Animate.css的纯CSS底部左侧淡入动画,无需JS,支持无障碍偏好设置。适用于快速添加元素入场动效,建议克制使用以避免干扰主要内容阅读。
需要为页面元素添加CSS入场动画 实现无JavaScript依赖的视觉过渡效果
recipes/css/anim-fadeinbottomleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinbottomleft -g -y
提供CSS关键帧动画fadeInBottomRight,无需JS,支持无障碍模式。适用于快速页面元素入场效果,建议克制使用以避免干扰阅读体验。
需要添加CSS入场动画 前端UI动效实现
recipes/css/anim-fadeinbottomright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinbottomright -g -y
提供Animate.css的Fade In Down CSS关键帧动画,无需JS且尊重无障碍设置。适用于快速添加元素入场效果,建议克制使用以保障可访问性。
需要CSS入场动画 实现淡入下移效果
recipes/css/anim-fadeindown/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeindown -g -y
提供Animate.css中FadeInDownBig动画的CSS实现,支持无障碍设置。适用于快速添加无JS的入场动画,建议适度使用以避免干扰关键内容。
需要CSS入场动画 集成Animate.css
recipes/css/anim-fadeindownbig/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeindownbig -g -y
提供基于Animate.css的Fade In Left CSS关键帧动画,无需JS且支持无障碍设置。用于为元素添加左侧进入效果,建议适度使用以避免干扰重要内容阅读。
需要CSS入场动画 实现无JS的页面元素淡入左移效果
recipes/css/anim-fadeinleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinleft -g -y
提供基于Animate.css的CSS关键帧动画技能,实现元素从左侧淡入效果。无需JS,支持减少运动偏好设置,适用于前端界面增强,使用时需保持克制并保留版权信息。
需要添加CSS入场动画 前端UI动效开发
recipes/css/anim-fadeinleftbig/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinleftbig -g -y
提供基于Animate.css的Fade In Right CSS关键帧动画,无需JS且支持无障碍设置。适用于快速添加元素入场效果,建议克制使用以避免干扰阅读体验。
需要为HTML元素添加CSS入场动画 寻找无JavaScript依赖的CSS动画方案
recipes/css/anim-fadeinright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinright -g -y
提供CSS关键帧动画Fade In Right Big,无需JS,支持减少动态偏好设置。用于快速实现元素入场效果,建议适度使用以保障可访问性。
需要纯CSS入场动画 集成Animate.css组件
recipes/css/anim-fadeinrightbig/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinrightbig -g -y
提供基于Animate.css的CSS淡入左上角入场动画,无需JS且支持无障碍设置。用于快速为元素添加视觉动效,建议适度使用以优化用户体验。
需要为UI元素添加CSS入场动画 前端页面需要非JavaScript的视觉过渡效果
recipes/css/anim-fadeintopleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeintopleft -g -y
提供Animate.css中Fade In Top Right的CSS关键帧动画实现,无需JS,支持无障碍偏好设置。用于为元素添加从右上角淡入的视觉效果,建议克制使用以避免干扰重要内容阅读。
需要添加CSS入场动画 前端页面动效开发
recipes/css/anim-fadeintopright/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeintopright -g -y
提供基于Animate.css的Fade In Up CSS关键帧动画,无需JS。支持prefers-reduced-motion无障碍设置,需遵守许可协议并适度使用。
需要CSS入场动画 前端页面添加淡入向上效果
recipes/css/anim-fadeinup/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinup -g -y
提供CSS关键帧动画Fade In Up Big,源自Animate.css。无需JS,支持无障碍模式,适用于快速添加元素入场效果,建议克制使用以避免干扰核心内容阅读。
需要为HTML元素添加无JavaScript的入场动画 前端开发中引入CSS动画效果
recipes/css/anim-fadeinupbig/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeinupbig -g -y
提供Animate.css的fadeOut CSS关键帧动画,无需JS,支持无障碍偏好设置。用于快速实现元素退出时的淡出效果,建议克制使用并保留版权署名。
需要CSS淡出动画 前端添加无JS过渡效果
recipes/css/anim-fadeout/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeout -g -y
提供基于Animate.css的CSS关键帧退出动画,无需JS且支持无障碍设置。适用于快速添加元素淡出效果,建议克制使用以避免干扰阅读。
需要为元素添加CSS退出动画 寻找无JavaScript依赖的CSS动画方案
recipes/css/anim-fadeoutbottomleft/SKILL.md
npx skills add nexu-io/motion-anything --skill anim-fadeoutbottomleft -g -y

Accueil - Wiki
Copyright © 2011-2026 iteam. Current version is 2.155.2. UTC+08:00, 2026-08-07 22:17
浙ICP备14020137号-1 $Carte des visiteurs$