Font Awesome 5 Icons Cheatsheet
Free & Easy to Use
Font Awesome 5 is one of the most popular icon libraries for web developers and designers. It lets you add scalable vector icons anywhere on your website using simple HTML classes no images required.
With this Font Awesome 5 Icons Cheatsheet, you can quickly search, preview, and copy icon code for instant use in your projects.
How to Use Font Awesome 5 Icons
Font Awesome icons are designed to work with inline HTML elements like <i> or <span>. Each icon uses a style prefix (such as fas or fab) followed by the icon name.
Use the search box below to find the exact icon you need in seconds.
Add Font Awesome 5 CDN to Your Website
To start using Font Awesome 5 icons, add the following CDN link inside the <head> section of your HTML document:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.css">
Copy & Paste Icon Code
Once you find an icon in the table below, simply copy its HTML code and paste it into your webpage.
Example: To display the Facebook icon, use this code:
<i class="fab fa-facebook"></i>
That’s it—the icon will appear instantly on your website.
Important Note About Font Awesome 5 Prefixes
The old fa prefix has been deprecated in Font Awesome 5.
- fas → Solid icons
- far → Regular icons
- fal → Light icons (Pro)
- fab → Brand icons (Facebook, Twitter, etc.)
Always use the correct prefix to ensure icons render properly.
Joydeep Deb
Senior Digital Marketer & Project Manager
Joydeep Deb is a results-driven Senior Digital Marketer and Project Manager with deep expertise in Lead Generation and Online Brand Management. An IIM Calcutta Alumni with an MBA in Marketing, he specializes in SEO, SEM (PPC), and Web Technologies.
Based in Bangalore, Karnataka - India.