Free Social Media Icons: Tricons

Mar 19 2010 by Damian Herrington | 21 Comments

In the pack, you will find 12 triangular wooden icons of popular social media sites released exclusively on Six Revisions. I wanted to create my first set of icons that were unusual from the rest of the other social media icons, yet still followed a particular popular design element: wood.

Each icon comes in 3 sizes (32px, 48px and 75px) in PNG format.

Preview

Free social Media Icons: Tricons

This icon pack is licensed under Creative Commons Attribution 2.0 and so they are free for personal and commercial use. You are not required to attribute the work, although it is very much appreciated.

Download

tricons-social-icon-pack (ZIP, 0.4 MB)

About the Author

Damian Herrington is a passionate freelance Web Designer from Hull, UK. He specialises in front-end development (HTML, CSS, JavaScript) to create innovative, clean and compliant websites as well as WordPress and X-Cart integration. If you’d like to connect with him, you can follow him on Twitter (@iDamianH), Flickr or at his Personal Website.

21 Comments

Ariel

March 20th, 2010

Excelent! thanks!

agon

March 20th, 2010

great pack…

Kawsar Ali

March 20th, 2010

These are interesting. Nice Share.

Creative Nuts

March 20th, 2010

nice designed icons :)

BEBEN

March 20th, 2010

wow…permition for download
thanks…^^

Antiphrasis

March 20th, 2010

Great idea about the triangular shape! One question though, how will you link them since the square shapes of the images themselves overlap? I guess the only way would be with an image map where you can have arbitrary shapes for the links. =)

Rory Dixon

March 21st, 2010

Great icon set – my only query would be how to implement them.

Natalie

March 21st, 2010

Nice set of icons. Thanks!

Damian Herrington

March 22nd, 2010

Hi all, thank you for the positive feedback that really is fantastic! There has been a couple of queried comments in how to implement these.

Ok, so you want to contain these icons within an un-ordered list, obviously within a particular order where the icons appear similar to the screenshot above. Then you make the un-ordered list to display inline, then give a negative margin-left to each of the li you feel is a suitable gap between each icon. Also remember when adding a href link around each image, don’t forgot to add text-decoration: none to remove hyperlink underscore. If comments permit adding code, below is an example. Hope this helps with the queries. Thanks

<li><a href="http://www.someweblink.co.uk" rel="nofollow"><img src="32x32/facebook.png" /></a></li>

Styling

ul li {display: inline;}
ul li {margin-left: -10px;}
ul li a {text-decoration: none;}

Thanks for the icons Damian:)

Ameya

Ari Herzog

February 10th, 2011

I have no recollection seeing triangular social icons anywhere. Is anyone using them? Nice!

Shey

August 23rd, 2011

wow very unique. Thank you for sharing!
I hope you add Google Plus

Six Revisions