Icons
Seagit Components uses FontAwesome for icons. Access thousands of professional icons with consistent styling and easy integration.
Using FontAwesome Icons
Import and use FontAwesome icons with the FontAwesomeIcon component
faUser
faStar
faHeart
faCheckCircle
faInfoCircle
faExclamationTriangle
Icon Sizes
Control icon sizes using Tailwind utility classes
size-3 (xs)
size-4 (sm)
size-6 (md)
size-8 (lg)
size-12 (xl)
Icon Colors
Apply colors using Tailwind text color utilities
FontAwesome
Used in Seagit Components
Seagit Components uses FontAwesome - the web's most popular icon library with 30,000+ icons. Access free solid icons or upgrade to Pro for 16,000+ additional styles.
Alternative Icon Libraries
If you need more icons beyond FontAwesome, check out these great alternatives:
Nucleo
PremiumA huge library of 3K+ vector icons with a consistent style.
Tabler Icons
FreeA set of 4,900+ free MIT-licensed icons with a clean, consistent design.
Download Tabler Icons →Installation Guide
1. Install FontAwesome packages:
npm install @fortawesome/fontawesome-svg-core
npm install @fortawesome/free-solid-svg-icons
npm install @fortawesome/react-fontawesome2. Import and use in your components:
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faUser } from '@fortawesome/free-solid-svg-icons';
function MyComponent() {
return (
<div>
<FontAwesomeIcon icon={faUser} className="size-6 text-blue-500" />
</div>
);
}