Back in April, before I left Clearleft, I started creating a few social media icons as a little side project. They were inspired by two specific icons within the BBC’s new Global Experience Language (GEL) document – those for RSS and Share.
The BBC’s icons were lovely, single-colour icons, and I could imagine a whole iconset along the lines of my colleague Paul Lloyd’s social media icons, but cleaner – simplified without all the bevels, gradients, and rounded corners. Indeed, much of this set is derived from his icons, and I thank him for his encouragement and advice based on what he found works and what doesn’t at such small sizes.
When BBC News (my news source of choice) launched a beautiful new design last week I tweeted about my unpublished GEL-inspired icon set, and within a day a friend who worked on their new site got in touch asking to use them!
BBC News only needed half a dozen (most of which are only visible when you click the green ‘share’ icon at the top of an article page), but there are many more which are free for you to use in exchange for attribution – a link back to this page would be appreciated, but isn’t required. The set isn’t comprehensive as-yet, but I intend to add and improve icons when I have time and when there is demand.
I’ve tried to stick to single colours and simplicity where possible, although that plainly wouldn’t work on some like Google, Dopplr and Stumble Upon, where I’ve only managed to reduce some of the shading and complexity rather than colours. I may try again later where I’ve failed this time!
Please download them and leave your feedback below (maybe also a link to a site where you’re using them!), and sign up for site updates in the box below so you don’t miss any updates to the set.
Click here to download the 16-pixel GEL Social Media Icon Set
You can use these icons under an Attribution-Share Alike 2.0 UK: England & Wales Licence. These are shared for the greater good, and I claim no ownership of the logos used in these icons.
They looking amazing! Love those clean icons
This sounds awesome Nice Paul!
These are awesome. Nice Work!
Nice work. I like the emphasis on global visual languages. We need all the standards in web UI design we can get.
Nice icons. Simple and effective
Just wondering; do you have these icons also in EPS/AI format? If so, are you going to release those aswell? Would be awesome!
Any plans for a GitHub icon?
Oh, and LinkedIn?
Your Twitter and Facebook icons looked great in my blog.
Thank you for sharing.
At that size I’d be tempted to use a bit of subpixel hinting for cleaner crisper shapes.
Being brutally honest – I can’t really see what you’ve done beyond minor tweaks to existing Favicons. Not too sure they really ‘gel’ (haha pun definitely intended) with Neville Brody’s icon set.
Hi, please could you tell me how to integrate these icons into my website ? I have downloaded the zip file but then what ? I am not in the least bit technical ! thank you
Just open the zip file, upload the icons to your webserver like you normally would do for graphics and all you need to do is post them like you would any other image, adding a link to them. Like this:
(take away the *’s and put your link information in the source code)
Nothing all too complicated.
I’m not seeing the source code I posted for you. If it’s still not showing later, email me at idoleyes13@comcast.net and I will help you out.
IS anyone reading the comments ???
Ballet news – sorry but as I said in my email to you, I can’t really give tech support on how to implement these on your blog.
Paul, thank you for these amazing icons. They simply look awesome. I first saw them on BBC website then googled if i could find them and here I go.
P.S. I agree with the above comments. It would be really nice if you could also include the LinkedIn icon, Send an e-mail icon, and print the page icon, compatible with this set.