DebtCC Icon System
30+ Dynamic SVG Icons • Fully Customizable • Tailwind CSS Compatible
Finance & Business
calculator
dollar
credit-card
briefcase
trophy
scale
building
Communication
envelope
phone
document
book
Interface
check-circle
shield
lightbulb
star
clock
info
warning
success
error
Navigation
home
arrow-right
arrow-left
arrow-up
arrow-down
menu
close
search
Social
users
hand-help
Analytics
chart
Size Options
Small (sm)
16px
Medium (md)
24px - Default
Large (lg)
32px
X-Large (xl)
48px
Color Customization
Purple
Blue
Green
Red
Yellow
Pink
Indigo
Gray
Usage Examples
Buttons with Icons
Status Indicators
Payment successful! Your account has been updated.
Warning: Please verify your information before proceeding.
Did you know? We've helped over 500,000 people become debt-free.
Feature Cards
Debt Calculator
Calculate your monthly payments
Secure & Safe
Your data is protected
Expert Support
24/7 customer assistance
Code Example
import Icon from '@/components/Icon';
// Basic usage
<Icon name="calculator" />
// With size and color
<Icon name="shield" size="lg" className="text-purple-600" />
// In a button
<button className="flex items-center gap-2">
<Icon name="check-circle" size="sm" />
<span>Get Started</span>
</button>This icon system is ready to use throughout your DebtCC site!
See ICONS_README.md for full documentation.