October 4th, 2007 in Photoshop Tutorials by Richard Carpenter
Windows Vista/XP Icons Tutorial




3 Votes, Rating: 5
About The Author: Richard Carpenter
Richard Carpenter has written 331 posts.
Create a new document 250×250, select the “elliptical marquee tool” and draw out a circle.
![]()
Fill with a “radial gradient” with your 2 chosen colors, ive chosen 2 shades of blue. (#295ea3 and #214b83).
![]()
Create a new layer under your blue circle (or wot ever color you have chosen). Hold down “ctrl” and click on your blue circle layer to make a selection. Then goto “select > modify > expand” expand it by 8 pixels. Now fill the selection with a grey color.
![]()
Now hold down “ctrl” again and click on the blue cirle to make a selection again, click on your grey circle layer and hit the delete key. If you hide your colored circle layer you should have this.
![]()
Now add these layer styles to your grey ring shape.
![]()
![]()
![]()
![]()
![]()
You should have something like this.
![]()
Now select the type tool, a nice bold font and a font size of about 200, then type your symbol ive used a “!” sign, you could also use a picture if you wanted.
![]()
Now right click your grey ring layer and goto “copy layer style”, then right click your text or logo layer and goto “paste layer style”, you text or logo should turn out like this.
![]()
Now select the “elliptical marquee tool” again and draw out a smaller circle at the top, and fill with the color white.
![]()
Set the opacity to 15% and add a layer mask.
![]()
Duplicate your layer, press “ctrl +t” to enter into free transform mode, resize your white circle, make it a bit bigger and place slighty above your other one.
![]()
Thats it all done, heres a few more.
![]()
![]()
![]()
Be Part Of The Community!
Become part of the hv-designs community.
Subscribe Via RSS or Follow Us On Twitter.
Leave a Reply
Other Blogs Ive Written For
On occasions i write tutorials and articles for other blogs/tutorial websites, here are a list of tutorials and articles ive written. Features tutorials written on six revisions and PSD Tuts+.
Six Revisions Submissions
- Illustrative Web Design Layout Pt.1
- Illustrative Web Design Layout Pt.2
- 3D Gallery
- 3D Ribbon Style Layout
- Minimal Portfolio Layout
- Minimal Portfolio Layout PSD Sitebuild
PSD Tuts+ Submissions
HV-Design Flickr Group
Submit your photoshop artwork to the hv-designs flickr group. Not a member? Join Now.
Search HV-Designs
Can't find what your looking for??, Try searching.
Write For HV-Designs
Intrested in publishing some articles, tutorials or freebies on hv-designs.? We welcome anyone who is intrested, we'll even return the favour by sending you aload of goodies. Learn More




4 Responses to “Windows Vista/XP Icons Tutorial”