24 01, 2014

More Free Social Vector Icons! (flat icon set)

By | 2016-11-22T18:23:43+00:00 January 24th, 2014|Categories: Web Development, Creative Design|Tags: , , , |

This is a new set to go along with:

You can download this set by right clicking on the below preview and using ‘Save Image As’.

This icon set includes the following flat icons:


  • Khan Academy
  • Aim
  • Quora
  • Kickstarter
  • CodeSchool
  • MongoDB
  • Backbone.js
  • Coderwall
  • HTML5
  • CSS3
  • Responsive Web Design
  • W3C
  • Codecademy
  • Yelp
  • IMDb
  • jsFiddle
  • Vevo
  • Codepen
  • Eventbrite
  • A List Apart
  • Instagram
  • Google Drive
  • GrubHub
  • Spotify
  • Dropbox
  • Vine
  • Paypal
23 09, 2013

Free Responsive Web Design (RWD), HTML5 and CSS3 Vector Logos in PSD, AI and PNG Formats

By | 2017-06-16T13:14:01+00:00 September 23rd, 2013|Categories: Web Development|Tags: , , , , , , , , , |

I was working on my personal website over the weekend and decided I wanted to use the HTML5 and CSS3 logos within my portfolio. When I went to do this I realized I had no visual way to display Responsive Web Design. I searched and couldn’t find any official RWD logos or a version that I felt would go along with the HTML5 and CSS3 logos like I wanted so I decided I was going to have to make it myself.


Here is the process of how I created the RWD logo:

  • Downloaded the vector versions of the HTML5 and CSS3 logos
  • Used Gotham Ultra to create the base for the ‘RWD’ in black
  • Tweaked the RWD slightly to match the ‘HTML and ‘CSS’
  • Used the shape and size of the ‘5’ and the ‘3’ as an outline to create the R
  • Used a color schemer online to choose a color that complimented the first two logos


I’m really excited with how it turned out so I would like to share it with everyone. Feel free to use it however you wish!! The RWD logo’s I did see were a lot of the time in a shade of dark gray so also feel free to change the color if black becomes the new RWD signature color.

This vector set includes:

  • HTML5 Logo
  • CSS3 Logo
  • Responsive Web Design (RWD) Logo




Download Links


Also if you have any ideas to improve the R within the RWD logo please comment below! I struggled with it following the same structure as the 5 and the 3 but still looking like an R.

*Please note this is in no way an official logo or design for Responsive Web Design. Given RWD is a practice or methodology of a combination of multiple things I’m not sure there will ever be an official logo created for it. I did this as a way to display RWD visually next to the HTML5 and CSS3 logos within my personal website.

9 04, 2012

Using the Free Social Media Vector Icon Set as a Source File for Other Icon Sets

By | 2017-06-16T13:03:49+00:00 April 9th, 2012|Categories: Web Development|Tags: , , , , , , , , , , , , , , , |

Here a few examples of what you can do with just the fireworks png (un-flattened) vector file from my blog Free Social Media Vector Icon Set.  Please note these are mainly to showcase using the file as a source file for icon sets and the different levels of customization that could happen. Feel free to download them all and do what you’d like with them. Click here to download all social icon sets.


noise in background

words in background



No Background Colored

No Background

Round Styled

Round Color

Please Leave a comment if you’ve used these or if you’ve made a set out of these. I would love to see everyone’s ideas on how to deal with the ones I left black in the last set.  Also please leave a comment if there are any icons you would like to see added to the set.

6 03, 2012

Free Social Media Vector Icon Set (including pinterest and google plus!)

By | 2016-11-21T17:21:13+00:00 March 6th, 2012|Categories: Creative Design|Tags: , , , , , , , , , , |

First I would like to say I am a Web Developer here at Beacon so Design is not my specialty. However, I’ve gradually been getting annoyed by the round corners that are on most social icons. I think there is always the ‘too much’ factor and for me I’ve been given too much round icons. So the only thing that looks fresh and appealing to me anymore is square. I’ve looked at other free icon sets out there and still have yet to find a basic and simple square set. So I decided to give it a shot :).

All these icons are vectors I created within Adobe Fireworks CS4. For most of these I used the method mentioned in this post (http://trentrichardson.com/2009/04/11/convert-bitmaps-to-vectors-in-fireworks/) and others I copied the company provided vector into fireworks and modified from there. Feel free to download and do what you’d like with them. I have them all within one file for ease of creating/posting but again each is its own vector so you can copy it into another document or slice them out from the file.

Download Here

This Vector set includes:

  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
  • WordPress
  • Google +1
  • RSS
  • SlideShare
  • Goodreads
  • GitHub
  • Forrst
  • Amazon
  • Blogger
  • YouTube
  • Dribbble
  • Skype
  • Vimeo
  • Delicious
  • Technorati
  • Last.fm
  • StumbleUpon
  • Yahoo!
  • MySpace
  • Foursquare
  • Flickr
  • Tumblr
  • Meetup