Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Font Awesome vs Glyphicons in Twitter Bootstrap

I am a beginner in web development and I recently started working with Twitter Bootstrap, I know it uses Glyphicons which I already know how to use. But I also came across Font Awesome which says that it is built for Bootstrap.

What are the differences between the two? I mean is one an alternative for the other? Or should you use them in different places?

like image 587
user2471133 Avatar asked Jun 26 '13 03:06

user2471133


People also ask

Does Bootstrap use Font Awesome?

Setting up Font Awesome can be as simple as adding two lines of code to your website, or you can be a pro and customize the LESS yourself! Font Awesome even plays nicely with Bootstrap!

What is the difference between glyph icons and Font Awesome?

Font Awesome is a font and icon toolkit based on CSS and Less. Glyphicons are icon fonts which you can use in your web projects.

What can I use instead of Glyphicons?

Free Alternatives to Glyphicons You can use both Font Awesome and Github Octicons as a free alternative for Glyphicons.

Why is the Glyphicons used in Bootstrap 4?

Generally, Glyphicons are icon fonts which you can use in your web projects. Bootstrap includes 260 glyphicons. These glyphicons used for web project from Bootstrap Glyphicons Halflings Set. Glyphicons Halflings are not available for free of cost, but their creator has made them available for Bootstrap free of cost.


1 Answers

In Bootstrap 2.x.x Glyphyicons were in image format, hence you can't increase the size, change the color, background-color, etc easily. However, font-awesome gives you scalable vector icons that can instantly be customized — size, color, drop-shadow, and anything that can be done with the power of CSS.

Font-awesome is really an alternative for Glyphyicons which is getting updated time-to-time with new icons. Fat and Mdo are planning to integrate Font-awesome in bootstrap version 3 as a replacement for Glyphyicons.

My suggestion is you use bootstrap with font-awesome. First include bootstrap css and then Font-awesome css, so that the Glyphyicons will be override by font-awesome.

UPDATE

In bootstrap version 3.x.x glyphicons become font format, which will render nicely even in 12px font-size. If you're using the latest version of fontawesome, i.e. 4.01, you can use both glyphicons with fontawesome.

like image 130
Ravimallya Avatar answered Oct 26 '22 22:10

Ravimallya