Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why Font-Awesome icon class is different

Why fontawesome icon class is different

<script defer src="https://use.fontawesome.com/releases/v5.0.10/js/all.js" integrity="sha384-slN8GvtUJGnv6ca26v8EzVaR9DC58QEwsIk9q1QXdCU8Yu8ck/tL/5szYlBbqmS+" crossorigin="anonymous"></script>  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet" />      <i class="fa fa-edit"></i>  <i class="fas fa-pencil"></i>  <i class="fab fa-facebook"></i>
like image 943
Pranta Saha Avatar asked Apr 19 '18 05:04

Pranta Saha


People also ask

Why some of the font awesome icons does not show?

Are you using Font Awesome Free or Pro? - Some icons are only available in Font Awesome Pro. Double-check that the icon you want is in the version of Font Awesome you're referencing and using. Also, make sure you are using and referencing the right style prefix and supporting files to use Pro icons.

What is the difference between FAS and fa in Font Awesome?

fas - solid icons are usually filled with transparent outlines. far regular and fal light are similar. These icons are different than fas solid because they are mostly outlines and differ only in outline width. fal light icons have thinner outline compared to far regular.

How do I use font awesome icons in CSS class?

To use font awesome icons as CSS content code follow the below steps. Add a unique CSS class name to the icon element you want to use. Set the font-weight css property as 900 (For Solid), 400 (Regular or Brands), 300 (Light for pro icons). Set the content css property to the unicode value font awesome icon.

Is Fontawesome 6 backwards compatible?

Backward Compatibility When Hosting YourselfWe've included files to help make Font Awesome 6 easily backward compatible with older versions. Learn how you can easily get your Web Fonts or SVG project using v6 icons without touching a single <i> element or pseudo-element CSS rule.


2 Answers

The fa prefix has been deprecated in version 5. The new default is the fas solid style and the fab style for brands.

Please Refer to this

https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use enter image description here

like image 149
PHP Geek Avatar answered Oct 02 '22 13:10

PHP Geek


Chek out Font Awesome DOCS: https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use

This image has all the informations about prefixes so there is really nothing more to add :)

Font Awesome 5.10.0+ has duotone icons with new prefix fad.

enter image description here

like image 22
Jakub Muda Avatar answered Oct 02 '22 13:10

Jakub Muda