Micro Interaction
iart-ai/web-animation-skills/skills/micro-interaction作者 iart-aib6dba3eb7597无许可证34 个星标收录于 2026年10月9日更新于 2026年10月8日仓库3个月前更新
This skill should be used when the user asks to "add a hover/press effect", "animate a toggle or switch", "build an animated like button", "make a toast/snackbar slide in", "animate a drawer or modal", "animate list reordering or add/remove", "do a shared-element layout transition", or "polish UI feedback". Covers UI motion with Framer Motion (motion/react) and modern CSS.
仅公开文件列表。将技能安装到工作区后即可查看文件内容。
| 路径 | 大小 | 类型 |
|---|---|---|
| README.md | 0 B | text/markdown |
| references/css-recipes.md | 4.8 KB | text/markdown |
| references/framer-motion-recipes.md | 5.8 KB | text/markdown |
| SKILL.md | 8.4 KB | text/markdown |
来源与署名
来源：iart-ai/web-animation-skills位于skills/micro-interaction提交b6dba3e
许可证： 无许可证
内容归原作者所有。SourceWeft 从公开仓库中收录这些内容。
更多来自 iart-ai/web-animation-skills 的技能
Svg Animation
iart-ai
指导使用 CSS、SMIL 或 GSAP 制作 SVG 动画，产出带定位工具的独立 HTML 文件。
Page Transition Animation
iart-ai
在 Next.js App Router 中实现和调试页面进入/退出过渡动画，可使用 Framer Motion 或 View Transitions API。
Lottie Animation
iart-ai
集成、控制、换肤并导出用于 Web、iOS、Android 和 React Native 的 Lottie 矢量动画。
Gsap Web
iart-ai
构建 GSAP 网页动画：时间轴、ScrollTrigger、SplitText、Flip 以及 Lenis 平滑滚动同步。
Glassmorphism
iart-ai
用独立 HTML 构建磨砂与液态玻璃拟态界面效果，包含 CSS 模糊、边缘高光、动效与无障碍回退。
Ascii Animation
iart-ai
将生成场、图像、视频、3D 场景或终端帧渲染为动态 ASCII 字符画。
更多Design & Creative技能
Theme Factory
anthropics
提供 10 套预设配色与字体主题，并可即时生成新主题，用于为幻灯片、文档、报告和 HTML 页面统一风格。
Slack Gif Creator
anthropics
为 Slack 创建尺寸与体积经过优化的动画 GIF，提供 PIL 绘图辅助、缓动函数与校验工具。
Frontend Design
anthropics
在构建或改造用户界面时，提供打造独特、有意图的视觉设计的指导。
Canvas Design
anthropics
依据写好的设计理念创作原创视觉艺术，输出 PNG 或 PDF，适用于海报、艺术作品等静态成品。
Brand Guidelines
anthropics
将 Anthropic 官方品牌配色与字体应用到需要体现 Anthropic 外观风格的各类产物上。
Frontend Design
anthropics
指导智能体为新界面或改版界面进行独特、有意图的视觉设计。