Font-awesome 6 is the latest version icon library.

It adds 7000 new icons with this version, a total of 14000 icons in this library.

It adds a new thin icon set of icons.

Support lot custom properties to style an icon

You can also create your icon with this library and use it in your application.

It comes with a free and pro version.

Fontawesome 5 version has Around 7000 icons. It added more versions and the total icons in fontawesome6 have 14000 icons.

Fontawesome CSS custom properties

The following are the variables you can use in CSS using variables. --fa-style-family: font family for these icons. --fa-style: font-weight valid value --fa-display: valid values of the CSS display property --fa-inverse: the inverted color of an icon, value values are color codes(RGB,hexa codes, etc)

--fa-rotate-angle: rotation of an icon, valid values of the CSS transform property

And many more animations, bordered, pulled, stacking, Duotone, and pseudo-element style you can see more custom properties here

Here is an example for custom css variables

  :root {
    --fa-style-family: "Font Awesome 6 Pro";
    --fa-style: 400;
    --fa-border-color: blue;
    --fa-primary-color: blue;
    --fa-secondary-color: red;

and you can use the variables in CSS style as below

 color: var(--fa-primary-color);
  content: '\f39e';
  font-family: var(--fa-style-family);
  font-weight: var(--fa-style);

and it is used in HTML as given below.

<i class="fa-brands fa-facebook-f" class="facebookicon"></i>

You can use in css attribute as given below example

You can integrate this library in many ways.

  • web fonts
  • SVG and SVG Sprite
  • you can host the library in a custom environment
  • use it CSS content
  • SASS and SCSS support
  • WordPress
  • npm, bower, and yarn package
  • javascript package free and pro icons
  • python Django packages

Some of the existing icon names are refactored and have backward compatibility.

Fontawesome icon styles

Below is a set of icon styles that can be integrated into any application.

Icon stylesfont-familyDescriptionfont-weight
SolidFont Awesome 6 FreeOpensource free icons900
RegularFont Awesome 6 ProPro Icons400
LightFont Awesome 6 ProPro Icons300
ThinFont Awesome 6 DuotonePro Icons100
DuotoneFont Awesome 6 DuotoneDuotone Icons900
BrandFont Awesome 6 BrandsBrand icons400

You can get it from [font awesome 6 pro download](/