Form complex web apps to simple one page portfolio website, Icons are ubiquitous. They render much more appeal to users than simple text. Historically, Icons are images. Now, when responsiveness have become a key factor for the success of web apps, as a developer or designer you always look for ways to reduce the number of images loaded. Because more images are loaded, more HTTP requests are sent and latency increase.
Icon Fonts provide us developers / designers a great workaround. These are SVGs, a single file is loaded (thus a single HTTP request) and you can customize the look and feel with CSS.
There are several Icon Fonts are available. We will work with three most popular of them, namely Font Awesome, Bootstrap Glaphycons and Google Material Icons. All of these are super awesome, easy to use and customize as well.
This tutorial is wholly example based. We have embedded the code in JS BIN, so that you can play around with the code. Hopefully you will find these useful and use it for your own projects.
Please share and tweet if you like them so that more and more people can pick up from these ready to use examples and add awesomeness to their projects. If you have suggestions, please write to us. Listening to you is almost religious to us.
Next: Font Awesome Tutorial
- Weekly Trends
- 100 Python Projects for Beginners with solution
- Mastering NumPy: 100 Exercises with solutions
- SQL Tutorial
- SQL Inner Join
- Python Exercises, Practice, Solution
- Python Interview Questions and Answers: Comprehensive Guide
- MongoDB Exercises, Practice, Solution
- SQL Exercises, Practice, Solution - JOINS
- Java Basic Programming Exercises
- SQL Subqueries
- C# Sharp Basic Exercises
- SQL COUNT() with distinct
- Java Collection Exercises