Hugeicons

InstallationCopy Anchor Link

Add icons one by one, here Notification 01. Each icon is a file in your project, drawn from Hugeicons' free set (stroke rounded, at a stroke of 2); the core that animates them comes from @animate-ui/react/icons, which the CLI installs with the first icon.

npx shadcn@latest add @animate-ui/icons-hugeicons-notification-01

pnpm dlx shadcn@latest add @animate-ui/icons-hugeicons-notification-01

yarn dlx shadcn@latest add @animate-ui/icons-hugeicons-notification-01

bun x shadcn@latest add @animate-ui/icons-hugeicons-notification-01

UsageCopy Anchor Link

import { Notification01 } from '@/components/animate-ui/icons/hugeicons/notification-01';

<Notification01 animateOnHover />;

Each icon is also exported under Hugeicons' own name (Notification01Icon). Triggers, animations, timing and every prop are the same for all icon libraries: see Get Started.