ElaAdmin
Notifications
Clear all
System Update Complete

Your system has been successfully updated to v3.0

2 mins ago
New User Registration

John Doe just created an account

1 hour ago
Server Alert

CPU usage is above 80% threshold

3 hours ago
View all notifications
Messages
Mark all read
User
Sarah Johnson
5 min

Hey! I've finished the design mockups for the new dashboard...

Design Urgent
User
Mike Wilson
2 hours

Can we schedule a meeting to discuss the project timeline?

Meeting
User
Emma Davis
1 day

The client loved the presentation! Great work team!

Client
User
Alex Chen
2 days

I've pushed the latest updates to the repository

Development
View all messages
Profile
John Doe
Administrator
Online
My Profile Account Settings
Notifications
12
My Tasks
5
Lock Screen Logout
Storage
65%
Projects 12
Tasks 34

Modern Icons

Common Icons
fa-home
fa-user
fa-cog
fa-search
fa-heart
fa-star
fa-bell
fa-envelope
fa-trash
fa-edit
fa-check
fa-times
Navigation & Arrows
fa-arrow-up
fa-arrow-down
fa-arrow-left
fa-arrow-right
fa-chevron-up
fa-chevron-down
fa-chevron-left
fa-chevron-right
fa-angle-double-up
fa-angle-double-down
fa-caret-up
fa-caret-down
Business & Commerce
fa-chart-line
fa-chart-bar
fa-chart-pie
fa-dollar-sign
fa-shopping-cart
fa-credit-card
fa-briefcase
fa-building
fa-calculator
fa-coins
fa-receipt
fa-wallet
Files & Documents
fa-file
fa-file-alt
fa-file-pdf
fa-file-word
fa-file-excel
fa-file-image
fa-folder
fa-folder-open
fa-download
fa-upload
fa-paperclip
fa-copy
Social & Brands
fa-facebook
fa-twitter
fa-instagram
fa-linkedin
fa-github
fa-youtube
fa-google
fa-apple
fa-microsoft
fa-slack
fa-discord
fa-whatsapp
Common Icons
bi-house
bi-person
bi-gear
bi-search
bi-heart
bi-star
bi-bell
bi-envelope
bi-trash
bi-pencil
bi-check
bi-x
Bootstrap Specific
bi-bootstrap
bi-bootstrap-fill
bi-list
bi-grid
bi-grid-3x3
bi-columns
bi-layout-text-sidebar
bi-card-text
bi-menu-button
bi-toggles
bi-sliders
bi-palette
Media & Files
bi-image
bi-camera
bi-play-circle
bi-pause-circle
bi-volume-up
bi-volume-mute
bi-file-earmark
bi-file-pdf
bi-file-word
bi-file-excel
bi-file-zip
bi-folder
Icon Sizes
Font Awesome Sizes
<i class="fas fa-star fa-xs"></i>
<i class="fas fa-star fa-sm"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star fa-lg"></i>
<i class="fas fa-star fa-2x"></i>
<i class="fas fa-star fa-3x"></i>
Bootstrap Icons with Font Size
<i class="bi bi-star" style="font-size: 1rem;"></i>
<i class="bi bi-star" style="font-size: 2rem;"></i>
<i class="bi bi-star" style="font-size: 3rem;"></i>
Icon Colors
Using Bootstrap Text Colors
<i class="fas fa-heart text-primary"></i>
<i class="fas fa-heart text-success"></i>
<i class="fas fa-heart text-danger"></i>
Custom Colors
<i class="bi bi-heart-fill" style="color: #e91e63;"></i>
Icon Animations
Font Awesome Animations
<i class="fas fa-spinner fa-spin"></i>
<i class="fas fa-circle-notch fa-spin"></i>
<i class="fas fa-sync fa-spin"></i>
Pulse Animation
<i class="fas fa-heart fa-beat"></i>
<i class="fas fa-bell fa-shake"></i>
Icon Styles
Font Awesome Styles
<i class="fas fa-user"></i> <!-- Solid -->
<i class="far fa-user"></i> <!-- Regular -->
<i class="fab fa-github"></i> <!-- Brands -->
Bootstrap Icons Variants
<i class="bi bi-heart"></i>
<i class="bi bi-heart-fill"></i>
<i class="bi bi-heart-half"></i>
Usage in Components
Buttons with Icons
Input Groups
List Groups
  • Home
  • Profile
  • Settings