Font Awesome is a font and icon toolkit based on CSS and LESS. It was initially designed to be used to Twitter Bootstrap and later incorporated into the BootstrapCDN. If you have used Font Awesome then you know that it is simple to use on a website by adding the library to website assets. Line Awesome is kind of the same with only difference in icons.
Line Awesome is by Icons8 that packs 1380+ beautiful line icons. The collection covers a vast variety of icons covering Accessibility, Currency, Design, Music, Science, Security, Social, Winter, and much more. All the icons are flat-type based on the Icons8 Windows 10 style.
Also read: Best Free Online Icon Font Generator Websites To Create Icon Font
Open Source Alternative to Font Awesome with One Line Code: Line Awesome
The Line Awesome website lists all the icons in a well-categorized layout with a search bar at the top. You get icons for Accessibility, Alerts, Animals, Arrows, Audio & Video, Automotive, Autumn, Beverage, Brand Icons, Buildings, Business, Camping, Charity, Chat, Chess, Childhood, Clothing, Code, Communication, Computers, Currency, Date & Time, Design, Editors, Education, Emoji, Files, Finance, Fitness, Food, Games, Gender, Halloween, Household, Images, Interfaces, Logistics, Maps, Marketing, Mathematics, Medical, Music, Objects, Political, Religion, Science, Security, Social, Sports, Spring, Status, Travel, Weather, Winter, etc. You can use this to easily look up the icons you want to use, get their code and embed them to web pages.
How to Install Line Awesome
Load from CDN
One method to use Line Awesome is through CDN. If it is already installed on your CDN, you can add it to the header of a webpage and then use the icons on the page using one line of code.
<link rel="stylesheet" target="_blank" href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/css/line-awesome.min.css">
Downloadable Version
If you want to use Line Awesome on a self-hosted website, you can download the pack from the website and add it to your website assets. Simply use the following code in your CSS style sheet:
<link rel="stylesheet" target="_blank" href="path/to/line-awesome/css/line-awesome-font-awesome.min.css">
Usage
Once you include the Line Awesome to your web page, you add icons using the following code:
<i class="la la-XXXXX"></i>
Simply replace the ‘XXXXX’ with the icon name.
For example
<i class="la la-battery-three-quarters"></i>
Closing Words
Line Awesome is a decent alternative for Font Awesome if you want to use line-style icons or just need a change. Line Awesome icons have a bigger 32×32 px and 64×64 px. And you can easily optimize it for smaller 14×14 px or 16×16 px using the CSS. Give it a try and do share your thoughts on this in the comments.
