像素小螃蟹动图，纯 SVG+CSS 不碰 GIF 帧

做什么用

想要一只会举道具、戴帽子、有反应的像素螃蟹？不用逐帧画，CSS 关键帧让它在聊天里活起来，还能导出循环 GIF。用 <rect>/<polygon>/<circle> 搭螃蟹，@keyframes 做动画。

应用范围

用在「做图」这一格。只认像素螃蟹造型，其他角色得自己改代码；动画只支持 CSS 关键帧，复杂物理效果做不了。

如何使用

• 就按「像素小螃蟹动图，纯 SVG+CSS 不碰 GIF 帧」这一件来做，不要中途改风格。
• 把我手上这张按它的规矩重做，风格不许换。
• 只要成品，过程里的解释可以没有。
• 做完对照应用范围，越界的那一稿丢掉。

安装