W3CoreUI

Font Awesome.

Font Awesome is a popular icon toolkit that provides a vast collection of scalable vector icons. These icons can be easily customized using CSS. Click here

Example

Use Font Awesome Icons with a spesific class.

Classic Solid

Classic Regular

Classic Brands


<i class="fa-solid fa-font-awesome fs-4"></i>
<i class="fa-solid fa-table-columns fs-4"></i>
<i class="fa-solid fa-house fs-4"></i>
<i class="fa-solid fa-gear fs-4"></i>
<i class="fa-solid fa-spider fs-4"></i>
<i class="fa-solid fa-lightbulb fs-4"></i>

<i class="fa-regular fa-font-awesome fs-4"></i>
<i class="fa-regular fa-lightbulb fs-4"></i>
<i class="fa-regular fa-map fs-4"></i>
<i class="fa-regular fa-clock fs-4"></i>
<i class="fa-regular fa-bell fs-4"></i>
<i class="fa-regular fa-heart fs-4"></i>

<i class="fa-brands fa-facebook fs-4"></i>
<i class="fa-brands fa-slack fs-4"></i>
<i class="fa-brands fa-apple fs-4"></i>
<i class="fa-brands fa-github fs-4"></i>
<i class="fa-brands fa-web-awesome fs-4"></i>
<i class="fa-brands fa-discord fs-4"></i>

Colors

You can use Font Awesome Icons with a specific class, and style them using text utilities like text-primary, text-success, or any text-* class for quick color control.

primary

secondary

success

danger

info

warning

dark

light

gray


<i class="fa-solid fa-font-awesome text-primary"></i>
<i class="fa-solid fa-font-awesome text-secondary"></i>
<i class="fa-solid fa-font-awesome text-success"></i>
<i class="fa-solid fa-font-awesome text-danger"></i>
<i class="fa-solid fa-font-awesome text-info"></i>
<i class="fa-solid fa-font-awesome text-warning"></i>
<i class="fa-solid fa-font-awesome text-dark"></i>
<i class="fa-solid fa-font-awesome text-light"></i>
<i class="fa-solid fa-font-awesome text-gray"></i>

Sizes

You can use Font Awesome Icons with a specific class and control their size using Font Awesome’s fs-* font size utilities.

fs-1

fs-2

fs-3

fs-4

fs-5

fs-6


<i class="fa-regular fa-star fs-1"></i>
<i class="fa-regular fa-star fs-2"></i>
<i class="fa-regular fa-star fs-3"></i>
<i class="fa-regular fa-star fs-4"></i>
<i class="fa-regular fa-star fs-5"></i>
<i class="fa-regular fa-star fs-6"></i>