Line Awesome - Open Source Free Icon Font with 1380+ Modern Elegant Line Icons

Line Awesome is a stylish Font Awesome Alternative with popular and rich collection of icon fonts. You can use this pictographic icon sets in your articles, Graphic design, UI design and web design. This is a best Alternative of Font Awesome with Rich Icon Fonts.

Are you trying to find the best Alternative to Font Awesome?

Font Awesome is replaced by Line Awesome, which is a free alternative. It includes 1380+ flat icons that cover the entire Font Awesome icon collection.

This icon font is built on the Icons8 Windows 10 icon pack design, which includes over 4,000 icons, so check it out if you're looking for more unique icons.  

There are very few options available able but Line Awesome replaced the Font Awesome with modern stylish line icons. This is the best Alternative to Font Awesome with modern stylish line icons.

You will find all types of alternative of Font Awesome icons such as

  • Blogging utility icons
  • Music set icons
  • Windows icons
  • Software icons
And many more.

What is Line Awesome?

Line Awesome is a rich collection of pictographic icon sets that contains clear line icons which is ready to use on your website.

The concept of Line Awesome quite new and still very few users are using it to enhance and beautify their blog design.

In this article, we will introduce you to this most popular and rich pictographic icon set and how to utilize it in your blog?

Line Awesome — Free Beautiful Icon Font

You won't believe it!

Line Awesome is a rich library of 37,900 Free Flat Icons which can be transformed into any format, size and colour. You can integrate and display line awesome by using CSS script. As a new user, you may face some trouble and many users complain that line awesome is not working in their blog. 

So now you have a wide range of choice to use various pictographic icon fonts. The most exciting news is you can use their icons for free for personal or commercial use if you put a link on your website.

As a web developer and Blogger, you may use Font Awesome icons for tailoring your site. Definitely, Font Awesome icons are really awesome, but if you compare both Line Awesome and Font Awesome then you will get some advanced benefit from Line Awesome.

However, both are handy for improving our web design and interface. Line Awesome features icon fonts that contain symbols and pictographs. And it can be style and decorate with CSS coding.

Line awesome is hosted on the fastest and reliable CDN to deliver smooth service to your website. This pictographic icon font works as an alternative to SVG image icons. You can also download line awesome font icons for use in your other design elements.

Line Awesome - Best Alternative of Font Awesome with Rich Icon Fonts

Benefits of Using Line Awesome

There are some benefits that will give you more priority to Line Awesome over Font Awesome. Let's see it below-

  • Line Awesome icons easily modifiable in order to be read by screen readers which provide accessibility according to W3C guidelines.
  • Line Awesome's icon fonts contain clear line icons. In contrast, Font Awesome instead of clear lines, they are composed of solid fill.
  • It compatible with almost all browsers, even it works with Internet Explorer 4.
  • Another feature of Line Awesome is “plug and play” which requires a few lines of code in order to work on a webpage.
  • Line Awesome icon fonts are made of vectors that can respond to CSS styling such as colours and size among other enhancing features.
  • In CSS styling it eliminates the use of multiple images to achieve various interactive effects.
  • It can load faster than Font Awesome and reduce the file size on a webpage.
  • Line Awesome icons can be used in a 32x32 px grid, while Font Awesome might start with 14x14 px.
  • It can utilize every pixel in the screen, Simply we can say it Pixel perfect.
  • Line Awesome icons can be easily resized without losing an elegant look.

How to Integrate Line Awesome in Blogger Theme? 

This is quite easy to integrate Line Awesome on the Blogger template. If you are using Font Awesome then you can add Line Font Awesome easily. 
 
 Step #1: Go to https://www.blogger.com and Sign in to your account 
 
 Step #2: From Blogger Dashboard click on ->Theme ->Edit HTML 
 
 Step #3: And locate the <head> section in your Blogger theme 
 
 Step #4: Finally copy the following line of markup and paste it below <head>

<link href='//maxcdn.icons8.com/fonts/line-awesome/css/line-awesome.min.css' rel='stylesheet' type='text/css'/>

Step #5: Now simply hit the Save theme from the top.

Congratulation! you have successfully integrated Line Awesome in your Blogger template.

Line Awesome Icon Cheatsheet

Generally all pictographic icon display according to icon code. Font Awesome user is already aware of this that we have to use code from a list of icon code. Similarly, in the case of Line Awesome, we have to use icon code. 

One of the following classes can be used to adjust the scale of the Line Awesome icons:

  • la-lg
  • la-xs
  • la-sm
  • la-lx
  • la-1x
  • la-2x
  • la-3x
  • la-4x
  • la-5x
  • la-6x
  • la-7x
  • la-8x
  • la-9x
  • la-10x
  • la-fw
You can grab the all code by visiting the below URL. 
Visit Official Website: Line-awesome

After landing on the site Just click on any icon and you will explore the icon code easily.

How to use Line Awesome in Blogger Theme? 

This is a good question that after integrating Line Awesome file, how we can use it in our Blogger template? 

We can write Line awesome in Blogger template file by Edit HTML and alternatively, we can write it in Blog Post on "HTML" View. However, for Resizing and colouring, we must use CSS script. 

 All Line Awesome icons writing is similar to Font Awesome. It starts with la and in the case of Font Awesome, we use fa. You can have a look at the below example of the Line Awesome icon code. This code will show Bull Horn. 

<i class="la la-bullhorn"></i>

For placing icons in a list style we can write it like below
<ul class="la-ul">
<li style="text-align: left;"><i class="la la-adjust"></i>Adjust Icon</li>
<li style="text-align: left;"><i class="la la-anchor"></i>AnchorIcon</li>
<li style="text-align: left;"><i class="la la-balance-scale"></i>Balance Icon</li>
</ul>
line awesome customization

The above icon set will display in default size. but if you wish to increase the icon size then you can add a simple CSS script like below.


<style>
.la-ul{font-size:22px;}
</style>
<ul class="la-ul">
<li style="text-align: left;"><i class="la la-adjust"></i>Adjust Icon</li>
<li style="text-align: left;"><i class="la la-anchor"></i>AnchorIcon</li>
<li style="text-align: left;"><i class="la la-balance-scale"></i>Balance Icon</li>
</ul>

Here I have added font size 22px. So Line Awesome icons will now become bigger.

How to add colour on Line Awesome Icons?

I will show you how to add colour to Line Awesome icon. for your convenience, I will use the same code.

<style>
.la-ul{font-size:22px; color:#0BBE46}
</style>
<li style="text-align: left;"><i class="la la-adjust"></i>Adjust Icon</li>
<ul class="la-ul">
<li style="text-align: left;"><i class="la la-anchor"></i>AnchorIcon</li>
<li style="text-align: left;"><i class="la la-balance-scale"></i>Balance Icon</li>
</ul>

How to add Line Awesome Icon in Horizontal style with Fixed Width?

If you wish to add Line awesome icons in horizontal style with fixed with then you can write it like below.


<div class="list-group">
<a class="list-group-item" href="#"><i class="la la-home la-lw"></i> Home</a>
<a class="list-group-item" href="#"><i class="la la-book la-lw"></i> Library</a>
<a class="list-group-item" href="#"><i class="la la-pencil la-lw"></i> Applications</a>
<a class="list-group-item" href="#"><i class="la la-cog la-lw"></i>Settings</a>
</div>  

Line Awesome - Best Alternative of Font Awesome

Conclusion

I hope you have got a clear idea about using Line awesome in your Blog. Many web developers give preference to Line Awesome, even they are using this in many Web applications. You will find many popular web application like iOS 10, Windows 8, Windows 10, Android 4 icons in Line Awesome.

Definitely you will love it for crispy and shiny icons in your website. Additionally if you are interested to work with large icon liek 32px X 32px then Line Awesome looks great.

Go Up