@agentable/icons-react

@agentable/icons-react

Lightweight, high-performance React icon library providing a massive collection of carefully designed SVG icons with Tree-Shaking support by default.

Features

• 🚀 Plug and Play: Each icon is an independent React component
• 📦 Tree-Shakable: Only bundle the icons you actually import
• 🎨 Fully Customizable: Control size, color, and stroke through props
• 🔧 TypeScript: Complete type definitions out of the box

Installation

::: code-group

pnpm add @agentable/icons-react

yarn add @agentable/icons-react

npm install @agentable/icons-react

:::

Quick Start

1. Named Import (Recommended)

import { Home, User } from '@agentable/icons-react';

const App = () => (
  <div>
    <Home />
    <User color='tomato' size={32} />
  </div>
);

2. Direct Path Import (Fastest Build)

import Home from '@agentable/icons-react/icons/Home';

const App = () => <Home />;

Props

Name	Type	Default	Description
size	number | string	24	Width & height (in px)
color	string	currentColor	Stroke color
strokeWidth	number	2	Stroke width
absoluteStrokeWidth	boolean	false	Auto-scale stroke based on icon size

Supports all native SVG SVGSVGElement attributes.

Migration from Lucide React

APIs are fully compatible, just replace the package name:

-import { Home } from 'lucide-react';
+import { Home } from '@agentable/icons-react';

Made with ❤️ by Agentable