Font Awesome - Icons. Easy. Done

in steemhunt •  7 years ago 

Font Awesome

Icons. Easy. Done


Screenshots

font.JPG

font01.JPG


Hunter's comment

0. Repository


https://github.com/FortAwesome/Font-Awesome


Hi, @jayplayco here.

When surfing around the web I`m quite sure that almost everybody has seen the implemented icons in different web pages. Font Awesome is, like the name indicates, an awesome Open source project making it available for everybody and implement it easily into each projects.

1. What is is for? Why Icons and why Font Awesome?


Icons, Logos, etc are an fast and direct way to communicate without knowing the language in behind. You can compress the meaning of a category or an action easily with an icon.
The difficulty is that not everybody is an graphic designer and able to create their own icon. On the other side license and ownership about icons makes it difficult to use icons out there.

Font Awesome is solving two issues at ones, at it is not making over 1,109 Free Icons in a a lot of different categories available, it also solves the issue that you have to bind the icons as image into your web projects, as it is going to be used as a Font. That is really great (and also saving a lot of bandwidth~!)

2. How to use it?

Font awesome is now in the 5th version and there are different ways to implement it into your projects.
a. Web Fonts with CSS
Use the Free CDN for web fonts and CSS
This is great for persons who dont want or cant host files, like wordpress sites.
b. SVG with JS
Also with Font Awesome CDN.
c. Desktop Use
Download the OTF file to use the fonts on your desktop. Find the Files here. They are in the /advanced/options/raw-svg folder included.

d. Advanced Use
Font Awesome has prepackaged files also for React and Vue.js. Angular, Ember, Ruby and Phoenix are also in preparation. Find it here

Font Awesome has also a very good categorized overview about their Icons which can be accessed here



3. What is the difference between Free vs Pro?


With the free version you get access to total 1,109 icons mostly in Solid. (Which is by the way more than enough for any usual private and commercial use). With Font Awesome 5 Pro, you get 1,877 More Icons in different styles (Solid, Regular, Light) and a Private NPM Repository and soon a dedicated Pro CDN. The license starts for 60USD per year.



4. But there is no Steem Logo~!


Yes, in the original Font Awesome library there is no Steem logo included. But the great thing about Open Source is that it is Open Source :)
@bhj has made about 6 month ago an own git version with a Steemit Logo included. You can find the text and explanation here~! Thanks to @bhj for this great work!.




5.Conclusion


If you need some icons to explain or compress your meanings Font Awesome is a great place to start, as they can be used either private or commercial and with over 1,000 Icons you can find almost every normal icon you can think of. The icon numbers are also growing steadily and getting updates in regular base, so it should be bookmarked by every interested content creator.


Link

https://fontawesome.com/?ref=steemhunt


Contributors

Hunter: @jayplayco



Steemhunt.com

This is posted on Steemhunt - A place where you can dig products and earn STEEM.
View on Steemhunt.com























Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Great hunt @jayplayco and your presentation and information is beautiful! This hunt has been verified and approved by the Steemhunt Moderation Team. Great job! Happy hunting.

Thanks @urbangladiator I hope that the people will concentrate on quality hunts and not on quantity. :)

Pros:

  • A huge library that encompasses nearly six hundred and fifty icons.
  • The code to edit various attributes couldn't be any simpler.
  • Adding each additional icon is quite simple with this program.

Cons:

  • Still involves a little bit of coding no matter what you do (even if it is simple.)
  • Most icons are trapped in the premium version. This shouldn't be a problem if you enjoy the suite and plan on purchasing this product anyway.

Pros:

  • A huge library that encompasses nearly six hundred and fifty icons.

  • The code to edit various attributes could not be any simpler.

  • Adding each additional icon is simple with this program.

  • This is only true of the main library that has already been incorporated into the website that you are working on, however.

Cons:

  • You will enter these full logo images as you would a font. Entering one simple line to change that web logo to red. Entering another simple line to change the size of the vector and so on .... and so on. You are essentially generating and editing vector logos as if they were fonts at your disposal. The idea is unique indeed.

Pros:

  • The program generates vectors of each icon. Vectors allow easy editing of all attributes while maintaining full quality (unread).

  • Works with Word Press and other site design applications.

Cons:

  • There is full compatibility of Word Press offered through two options. The user can use the official plugin or simply install the compatibility function manually. In general, most critics seem to agree that manual installation is the best option.

Pros:

  • Huge variety of icons
  • User friendly (for those who have basic coding skills)
  • There's a free version

Cons:

  • Small target group

Good hunt! Thanks for sharing!

Congratulation! Your hunt was ranked in 41st place on 4 Jun 2018 on Steemhunt.

We have upvoted your post for your contribution within our community.
Thanks again and look forward to seeing your next hunt!

Want to chat? Join us on:

Hi @jayplayco!

Your post was upvoted by utopian.io in cooperation with steemhunt - supporting knowledge, innovation and technological advancement on the Steem Blockchain.

Contribute to Open Source with utopian.io

Learn how to contribute on our website and join the new open source economy.

Want to chat? Join the Utopian Community on Discord https://discord.gg/h52nFrV