Advertisment
Nowadays, there are so many graphic designers who have their own style of making icons and buttons. I have my own style too. Take your time to read on my Adobe Photoshop tutorial on making cool icons for your social media buttons. Actually, it can be applied on so many things, not only social media buttons, but I believe this effect could be the best one to be applied on your social media buttons.
I have also made 25 social media icons for 1stwebdesigner readers. But take a look at the tutorial first, then you may download those icons for free.
1. Make A Rounded Rectangle
The size and the color of the rounded rectangle is completely up to you. In this tutorial, I am using 10px radius for the rounded rectangle.
2. Give Effects
3. Add Some Text & Logo
In this example, I am using Futura for “SUBSCRIBE” word and Verdana for the rest. Once again, you may choose your own fonts and elements to be added on the rounded rectangle. I used Futura & Verdana simply because they are my favorite fonts.
Please note that I am using RSS logo from Iconspedia, which can be downloaded for free here. Feel free to download it as it is free to be used on personal and commercial project.
4. Add Effect On The Logo (optional)
Do you notice that there is difference on the subscribe logo? This is optional one, you may apply this effect if you want.
5. Important!
Remember to remove background layer before saving your file as .png format. You must save this as .png format if you want to place your button on colored background.
Download PSD file & Fonts
I believe some of you want to apply this effect. I am providing psd file for all of you who wants to apply this effect instantly, without following steps that I’ve explained. I have also provided Futura & Verdana to be downloaded for free.
Some Example That I Already Made
These are some of the buttons that I have made using this cool effect. If you want to see where I used them, just visit my blog. I placed RSS and Twitter button at top sidebar. I have also used Stumble Upon button at the end of every article.
1WD Social Media Icons Pack By Albert Lie
Actually, not all of them are social media icons. I add some icons like friendster, blogger & skype just for fun only.
License: This icons are licensed under GPL v2. You are free to do anything with them. The only requirement is to keep them free for users. There is no attribution link needed and you are allowed to use them in your personal and commercial projects for free.
Thanks for sharing … it looks really nice !
.-= psddude´s last blog ..Quick Tip Add A Toasted Logo To a Piece of Bread =-.
Thanks for the nice tutorial.
.-= arun´s last blog ..create a multi boot CD using multicd.sh script =-.
Thanks for sharing information. Your explanation is very simple and clear. Now I can design my own buttons. Thanks!!!:-)
Very nice thanks ..
[...] 1WD Social Media Icons Pack + Detailed Tutorial To Make Them From Scratch [...]
How To Make Cool Icons For Your Social Media Buttons With Adobe Photoshop…
Take your time to read on my Adobe Photoshop tutorial on making cool icons for your social media buttons and you can also download the free icon pack at the end….
thanks for sharing.very simple and nice!
simple tutorial, easy to follow. thanks for sharing.
Thanks for a great tip! I really like the icons you’ve made. They look really good and useful!
[...] under: web-development — admin @ 12:12 am body { background-color:white; }Albertus Adrianto Read Post Nowadays, there are so many graphic designers who have their own style of making icons and [...]
[...] Original Source: Graphic and Web Design Blog -Resources And Tutorials [...]
Nice looking icon set! Thank you.
.-= Natalie´s last blog ..13 Must Follow Logo and Brand Identity Design Blogs =-.
Nice tutorial. Awesome icons set. Thanks man!
.-= Richie´s last blog ..How to avoid your Creativity Burnout =-.
thanks albert appreciate the download.
.-= G13 Media´s last blog ..Web Site Design San Diego Seo =-.
great easy to follow tutorial guys.. thanks for sharing the icon set.. awesome!
Hey Lie thanks for the tutorial and the collection. the icon set looks great :D
.-= sriganesh´s last blog ..40 Amazing Lomography wallpaper and Tutorials =-.