Thursday, May 23

CoffeeShop Free Social Web Icons!

I was designing a blog for JJM Photography today (her photography is stunning, I want her to give me photography lessons) and I needed some new custom social icons.  I designed my own set where I could quickly adjust the colors/background and wanted to share them with you.    Yes, this website is possible because I don't like to bother with terms of use on any design elements in my commercial work so I try to create things that you don't have to bother with them either.  ;-)

I have included an Etsy, Pinterest, Facebook, Twitter, and Instagram (isn't my little camera precious?) button with both a circle and square background.  You can change the colors to anything you like and you may use these anywhere in your personal or commercial websites/blogs without worrying about giving me any credit.

This is a layered psd file for Photoshop/PSE.  When you open the icon file, resize it to your final button size and then simply turn on the background circle or square on the bottom and click on its color fill layer  to adjust the final color of your icon.  Then turn on the eyeball to the right by the icon you want to create, such as Instagram.

Save as a jpg if you are loading them on a white background or as a png if you are loading them on a colored background.  Then Edit, step backwards, and turn on the next icon.  As Imp would say, it is "easy as pie!".

If you want additional icons to go with this set, comment below and I will add them on a future post.  Yes, I am that nerdy...  And I am also going to post the adjustable dots vintage paper psd file and a new action in the next few days.  Thank you for your kind comments!

Download the free commercial/personal use CoffeeShop Social Icons.  You can also download them here.

Do you want to download my favorite CoffeeShop Actions or Design Elements in one convenient zipped file AND help support this blog? Just click here for my action pack or here for a download of some of my most popular design elements, storyboards, and textures.


  1. Now I am frustrated, I can't get the icon to link to the appropriate site. I thought it would be like using a blog button to direct an icon click to your blog.

    I used the html gadget and entered the same code for a button only directing to my fb page address and the photo bucket link to your icon that I uploaded. Each one just redirects back to my blog when you click on it, but the blog address is nowhere in the code.

    What am I doing wrong? Thanks.

  2. THANK YOU!!! I pinned this for later reference.

  3. Rebecca, these are just simple icons without any links. You have to do the code on your own if you want to use these on your website.

  4. These are fab - thank you!!! An icon with an envelope for email would be a real blessing! :))

  5. Awesome, as usual, Rita! Thanks!!!

  6. These are so great! Thank you for your generosity.

  7. Wow, so cute. Thank you so much for sharing these :)

  8. Just added these to my website! Thank you!

  9. I like them, thanks a lot, if you need some more great vector pictures or icons I can advise you one great website besides there are all free, hope it will be useful for you. Good luck.


Thank you for taking the time to leave a message, I love reading them! All comments are personally moderated by me and I will post and answer them them as soon as possible.