图标
图标
为你已经在用的图标库提供动画版本。每个图标是项目里的一个文件,由 @animate-ui/react/icons 的一个小核心驱动。
图标不是整块缩放,而是按真实物体的方式运动:铃铛会摆,爱心会跳,箭头会指向该去的方向。每个图标都是通过 shadcn CLI 加入项目的单个文件,可以随意改描边与动画;驱动它们的核心来自 @animate-ui/react/icons。
怎么工作
每个图标文件内部用 AnimateIcon 的上下文与 IconWrapper 定义自己的动画变体,触发、计时与持久化由同一个核心统一处理。因此不同图标库的 props 完全相同,详见开始使用。
安装一个图标
以 Lucide 的 Bell 为例:
bunx shadcn@latest add @animate-ui/icons-lucide-bell
第一次安装图标时,CLI 会一并装上核心包与 Motion。
两套图标库的完整清单见各自页面,可按名称搜索并复制安装命令。