rendering-animate-svg

SKILL.md

Many browsers don't have hardware acceleration for CSS3 animations on SVG elements. Wrap SVG in a and animate the wrapper instead. Important for 8-bit components with pixel art icons and animations.

This applies to all CSS transforms and transitions (transform, opacity, translate, scale, rotate). The wrapper div allows browsers to use GPU acceleration for smoother animations, which is especially noticeable for retro pixel art animations.

将动画 SVG 元素包裹在 div 中以启用硬件加速。在对 SVG 图标或元素进行动画处理时应用，尤其是在具有像素艺术动画的 8 位复古组件中。 来源：theorcdev/8bitcn-ui。

打开你的终端或命令行工具（如 Terminal、iTerm、Windows Terminal 等） 复制并运行以下命令：npx skills add https://github.com/theorcdev/8bitcn-ui --skill rendering-animate-svg 安装完成后，技能将自动配置到你的 AI 编程环境中，可以在 Claude Code 或 Cursor 中使用

查看原文