As more and more devices adopt high-definition screens, font icons are becoming the popular choice to adopt. It is resizeable without compromizing quality and customizeable through CSS. We can easily change the color, the size, and even animate font icons with CSS3. Plus it is resolution-independent which makes it look crisp on any screen density.
FontAwesome is by far one of the most popular font source, with a huge collection of icons. But it is highly unnecessary to download the whole collection when you need to use just a few.
Here are some alternative sources of well-crafted font icons that I hope you would find useful at times to build your next great websites and apps in place of FontAwesome.
A Guide to: Better and Sharper UI Icons with Web Fonts
If you are familiar with using bitmap image formats (like PNG and GIF) to display icons on a... Read more
StackIcons
StackIcons are font icons for over 60 modern social brands. It comes with CSS, allowing you to style your font in many container shapes. You can get your social brand icons in circles, squares or with rounded edges. You can also color the icons in more than one color, giving you more realistic brand colors.
- License: SIL Open Font and MIT
Twemoji Awesome
Twemoji is an open source emoticon project from Twitter. Elle Kasai has ported it to a font icon called Twemoji Awesome. All class names to display the icons are the same as the Twemoji Cheat Sheet, but you need to use a dash instead of an underscore, that’s all. Here is an example of how we add the hatching_chick icon:
<i class="twa twa-lg twa-hatching-chick"></i>
- License: MIT and CC-BY for the Emoticon graphics
Font Diao
Font Diao is a collection of font icons from popular website or company based in China such as Alibaba, Alipay, WeChat, Xiaomi, and Weibo. The font may come into useful when you are building wesbites designated for China mainland audience who probably are familiar with this particular font.
- License: Public License
Socialicious
Socialicious is a font that is exclusively built for popular social websites like Facebook, Twitter and Instagram. The font is built to work nicely with Bootstrap. Here is an example code to build a button with Bootstrap .btn class in conjunction with font classes.
<a class="btn btn-linkedin"> <i class="icon-linkedin"></i> Connect with Linkedin </a>
- License: MIT License.
Octicons
Octicons is a set of font icons presented by GitHub, allowing you to use the same icon as used by GitHub on your project. There are more than 170 icons ready to apply on your next project.
Android Icons
This is the icon set created by Opoloo, previously known as the Android community. It includes 250 awesome icons in 5 sizes and 14 colors of native Android icons.
- License: Attribution-ShareAlike 4.0 International
DevIcons
DevIcons is a set of font icons handcrafted by Theodore Vorillas. It contains 85 symbols and logos of familiar development applications such as GitHub icon, Gulp icon, Angular icon, and many other.
- License: MIT
Open Iconic
Open Icon contains 223 icons ready to use with bootstrap, a framework or your own stylesheet. The font size is small, just 12.4Kb, which is about a quarter of what you can find in FontAwesome. The cool thing here is, these icons can be scaled down to 8px.
- License: SIL.
Material Design Iconic Font
There are 15 categories of Google Material Design-inspired font icons in this pack. To use them, just install Material-Design-Iconic-Font.ttf, then use this cheatsheet. Copy paste the icons (not the unicode) into your project. You can enlarge the icons, give it borders, spin, rotate or flip it with CSS.
- License: Attribution-ShareAlike 4.0 International
The post 9 FontAwesome Alternatives That Are Equally As Good appeared first on Hongkiat.
https://goo.gl/hYDEHJ
No comments:
Post a Comment