# Icon Systems
**Purpose**: Guidelines for using icon libraries
---
## Quick Reference
| Library | Loading | Recommended For |
|---------|---------|-----------------|
| Lucide | CDN script | Default choice |
| Heroicons | Inline SVG | Tailwind projects |
| Font Awesome | CDN CSS | Brand icons |
---
## Lucide Icons (Recommended Default)
### Loading
```html
```
### Usage
```html
```
### Common Icons
```
Navigation: home, menu, x, chevron-down, arrow-left, arrow-right
User: user, user-plus, users, user-check
Actions: edit, trash, save, download, upload, share, copy
Communication: mail, message-circle, phone, send
Media: image, video, music, file, folder
UI: search, settings, bell, heart, star, bookmark
Status: check, x, alert-circle, info, help-circle
```
---
## Heroicons
### Usage (Inline SVG)
```html
```
---
## Font Awesome
### Loading
```html
```
### Usage
```html
```
---
## Accessibility Best Practices
```html
Featured
```
---
## Custom SVG
```html
```
---
## Related
- `images-guide.md` - Image guidelines
- `fonts-guide.md` - Font loading
- `cdn-resources.md` - CDN libraries