What is Font Awesome? & How to Use It?
What is Font Awesome?
Font Awesome is a CSS library that designs the icon characters we use on websites as CSS and offers them to us for use.
In fact, Font Awesome, which first emerged for websites, has grown so much today that it can be used not only for the web but also in many places such as Android, iOS, PC, and even game consoles when developing applications.
In addition to CSS support, it now also offers SVG support, so Font Awesome is the icon packs that we can use in the sites and applications we develop.
Why Should We Use Font Awesome?
Previously, before Font Awesome and its alternatives were widespread on the market, we had to design the icons we would use for our applications in any visual editor and use them as outputs like PNG or SVG. As a result, it took time to create the icons, and the icons we created would cause problems such as websites opening slower.
Font Awesome offers us a solution to this and of course, this makes things easier for us.
Rather than spending minutes designing an icon for our site and adapting it to the site, it is more convenient and practical to integrate it into our site or application with 30-40 characters of code. Also, since these icons are developed with CSS, they will work much faster compared to a structure like PNG.
That's why we use and should use Font Awesome.
In addition, with the latest versions, instead of downloading and adding Font Awesome files to our site, we can easily add them using the API support offered by Font Awesome.
How to Install Font Awesome?
Using Font Awesome with API
To use Font Awesome without downloading via API, you should first go to the Font Awesome website and create an account. After creating an account, you can easily use Font Awesome in your projects once you include the link address that Font Awesome will give you into your project.
The link address that Font Awesome gives you
<link href='https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
You just need to include it in your project as shown above. After including it in your project
<i class="fa fa-user-plus"></i> or <i class="fa fa-try"></i>with such codes, we can use the icons we want. If you want to see all Font Awesome icons, you can check the Font Awesome icon search page.
Font Awesome Icon Search Page
Using Font Awesome by Downloading
To use Font Awesome by downloading, first you need to go to its website and download it.
After downloading Font Awesome, add to your project
<link rel="stylesheet" href="fontawesome5/css/font-awesome.css" /> // used like this for old versions.
<link rel="stylesheet" href="fontawesome5/css/all.css" /> // used like this with the new update.
You can use it by adding the code specifying the location of font-awesome.css between the "<head> </head>" tags as above.
After adding Font Awesome to our project, wherever we want to use the icons
Font Awesome Icon Search Page
After adding Font Awesome to our project, wherever we want to use the icons
<i class="fa fa-user-plus"></i> or <i class="fa fa-try"></i>with such codes, we can use the icons we want. If you want to see all Font Awesome icons, you can check the Font Awesome icon search page.
Font Awesome Icon Search Page
Yorum Gönder