Font Awesome is an incredibly popular library for adding icons to webpages. Pretty much every site these days use icons of some sort, and chances are they are loaded via Font Awesome. What exactly does "incredibly popular" mean? According to their landing page, the library is used on 100,000,000 sites. They are the de facto default for including icons on webpages. The project makes adding icons to sites simple by including them as a font, but there are alternative ways to use Font Awesome icons, such as SVG.
DEV is now included in Font Awesome version 5.4!
Thanks to popular demand from the community, our logo is now a part of the set. There are 388 total brand icons in the entire set, including some alternate versions of certain logos. In all there are about 250 total companies included in the Font Awesome set and DEV is now one of them. That puts us in remarkably exclusive territory. A lot of our members have been adding the DEV badge to their Font Awesome-driven personal sites in various hacky ways, but now we're part of the default.
Hack example:
Now that we are officially part of the library, you can add <i class="fab fa-dev"></i> to your any page that already makes use of Font Awesome!
You can also download the badge as an SVG right here if you'd like:
https://gist.github.com/benhalpern/eff81b17359acafd17849146549b9291
The above SVG file is only 798 bytes. If you want to modify the color of that SVG you can change the fill attribute in its code. If you are not familiar with SVGs, they are vector images constructed with markup language, and are a very powerful concept. Here's a good post on the web technology:
Article No Longer Available
SVG vs font set vs png vs whatever else. It's all just implementation details, but implementation details matter. Font Awesome's popularity speaks to this.
Thank you to Font Awesome for validating our project by inclusion in version 5.4 and thanks to the community for making this happen. If your site has the DEV badge alongside your GitHub and Twitter badges etc. feel free to link to it in the comments to show it off. π
Top comments (18)
You're welcome to use the SVG in any capacity as long as you're not literally trying to impersonate DEV or confuse people (which you are not). You're 100% good and you're a super welcome DEV member even if you're just a reader/lurker. No need to feel like a poser in any way.
That's Awesome! Congrats! Now I can go update all of my sites and just use FontAwesome instead of the SVG.
Edit: JackHarner.com has been updated with the new badge
Woohoo!
(As a perf nerd I must add the reminder that using font libraries is not always performant way to do things, but is a very dev-friendly way)
Either way, go forth and put the DEV badge everywhere with links to your profile!
Can you share a reading about perf and font libs ?
That's fantastic, @ben ! You and the rest of the team must be over the moon.
Thanks James!
You know you've made it now haha
Is it available in the most recent Ruby Gem?
Hmm Iβm not sure, but this was Font Awesome 5.4 so there is probably info on how the gem tracks the project.
I'll keep my eyes open. I want to add this badge to my blog soon enough.
love
I stopped using FontAwesome long time ago, but I have been their backer back in the day. Congrats on getting the DEV badge included in there :) π
Congrats! That's amazing!
Just added the badge to my blog. :D
Special thanks to @alvarocavalcanti , @themindfuldev and the hundreds more who petitioned Font Awesome to get us included. β€οΈ
dev.to is a great platform which I have been using more frequently in the last couple of months. It has great articles and great discussions.
Hey @ben they ended up adding the icon as
<i class="fab fa-dev"></i>as it appears in fontawesome.com/icons/dev?style=br...So I guess we need to update Add the DEV Badge to your personal site to reflect that as it's using
fa fa-dev-toinstead.In time: just updated my portfolio to use the brand new DEV font-awesome badge and it looks great!
Yaaay wonderful news! I will update my site and my post once Iβm back from my vacations :)