Iconic brings premium, “do wtf you want with” <a href="https://iconic.app/?utm_source=npm&utm_campaign=npm" target="_blank">pixel-perfect icons</a> right into React code, making your development process seamless. With over 1,400 icons available, you can f
npm install @iconicapp/iconic-reactIconic brings premium, “do wtf you want with” pixel-perfect icons right into React code, making your development process seamless. With over 1,400 icons available, you can find exactly what you need for any project—whether it’s a sleek UI element or a fun emoji. We add new icons every week, so there’s always something fresh to work with.
- 🎨 1,400+ high-quality SVG icons
- ⚡️ Zero runtime dependencies
- 📦 Tree-shakeable
- 🎯 TypeScript support
- 🎨 Customizable size, color, and stroke width
- 🔄 Easy icon syncing
- 💼 Pro icons support with license key
bash
Using npm
npm install @iconicapp/iconic-reactUsing yarn
yarn add @iconicapp/iconic-reactUsing pnpm
pnpm add @iconicapp/iconic-react`$3
Sync to get free icons
`bash
npx iconic-react-sync
`$3
Configure license key for pro icons`bash
npx iconic-react configure --license-key YOUR_LICENSE_KEY
`Note: If you don't have an Iconic Pro license key, you can get one at iconic.app or use the free icons.
$3
If you notice that you're missing icons, run the following command to update your library
`bash
npx iconic-react-sync
`Quick Start
`jsx
import AcornIcon from './components/icons/AcornIcon';function App() {
return (
);
}
`Icon Props
All icons accept the following props:
| Prop | Type | Default | Description |
|------|------|---------|-------------|
| size | number | 24 | Icon size in pixels |
| stroke | string | currentColor | Stroke color |
| color | string | transparent | Color |
Project Structure
`
/your-project
/node_modules
/iconic-react
/src
/components
/icons
/AcornIcon.tsx
/HeartIcon.tsx
/index.ts
`Troubleshooting
$3
1. Icons not appearing
- Verify icons are in the correct directory (
src/components/icons/`)2. Styling issues
- Verify prop types and values
- Check CSS specificity
- Ensure SVG viewBox is correct
The Iconic React package is licensed under the MIT License. Pro icons require a valid license key.
---
Made with ❤️ by the Iconic team