How did I Create My Own Web 2.0 Logo and Icon?


If you are new here, Subscribe to Full Feeds or by Email and receive free daily updates on Tips, Tricks and Tweaks..


I wanted to redo my header image for a long time and I finally got some time to finish the task. Though it was not a complete redo, the changes were made to be compatible with web 2.0 standards.

New Header Image

I did this using Adobe Photoshop CS, with a couple of tutorials that I had in my hand. Creating it is easy after you have finalized with the font and style. It took a longer time for me to finalize the design and after that it was just the procedure of following the tutorial to come up with the final image with gradient look and mirrored shadow image at the bottom. I also introduced a very light Gaussian blur at the back of the text.

How to create your own web 2.0 Logo?

Lyte Byte Logo

This video will explain everything in a step by step manner.



Maybe you can download this video and keep it for reference while you work on Photoshop. Check out the easy way to download any video on net.Icon Image:Icons are the ones which are used to mark a site by a symbol. The web 2.0 logo is not complete without an appropriate Icon Image. The icon image that I had earlier didn’t have symbolic meaning in it, so I thought of redoing the Icon Image also. As I was creating my header, I was flipping and rotating the characters using free transform and finally I settled with this new Icon. It’s just the capital ‘L’ and small ‘b’ upside down with ‘b’ inside ‘L’. It also looks like 97 (Quite innovative, huh?).

97 Icon Image

I was thinking of this image before but I settled with 97.

LB Icon Image

Learn how to create Icon Image for your site from any Image.

While searching for some good video tutorial on Photoshop, I found this one also. This explains how to create a 3D glass looking ball with a shadow image.

Get a Web 2.0 Logo for Free:

If you don’t have adobe Photoshop or have not worked on Photoshop before and if you want a simple web 2.0 header image for your website, then contact me and I would be happy to do it for FREE!!! All you have to do is when you change the header image in your blog, write a post about that you have redone your header image and link to this post.

Update: If you are looking for Web 2.0 Icons, check  “Places Where You Can Get Free Icons For All Seasons And Reasons

Read about Lyte Byte’s new blog header and logo


Related Posts:
  • Lyte Byte’s New Header and Logo
  • How to Design a 3D Box Cover for Your Free Ebook or Any Product?
  • Simple Steps to Create an Icon Image for a Website
  • The Best of Last Month from Lyte Byte - 1
  • Did Google make a mistake on their logo?


  • Enjoyed this post? Subscribe to Full Feeds or by Email and receive free daily updates on Tips, Tricks and Tweaks.


    16 Responses to “How did I Create My Own Web 2.0 Logo and Icon?”


    1. 1 Dj Flush

      Not a bad way to gain Popularity Joel :P
      You Rock

      Nice Post

    2. 2 Shankar Ganesh

      Thanks for sharing.
      Here’s a tutorial on how you could create a Web 2.0 Logo with GIMP:
      http://tysonc.net/tutorials/making-a-web-20-logo-in-gimp/

      Try this, and it’s really easy.

    3. 3 Mr.Byte

      @Shankar, Good one… As I always use Photoshop, I never tried GIMP…will try it out sometime…

    4. 4 Nirmal

      Nice post, informative.

    5. 5 barbi

      @ byte,

      thanks for sharing, even i prefer photoshop to anything else.
      it makes it quite easy to manage even intricate details.

    6. 6 jake

      great post, real informative.

    7. 7 Haris

      Thanks, will be helpful to me someday :)

    8. 8 greenzoid

      Nice tutorial:)

    9. 9 Silki

      I am a new blogger, but I also learnt to use Gimp and have made my logo in Gimp. Gimp is real lightweight program.

    10. 10 shashank

      Read this on Alleba website 2 weeks ago while searching for similar things…here is the direct link
      http://www.alleba.com/blog/2006/09/26/photoshop-tutorial-how-to-make-a-web-20-style-logo/
      Pretty nice tutorial .

    11. 11 cdn

      What on Earth is a Web 2.0 logo, and how is it special from any other sort of logo? And what exactly is a web 2.0 ’standard’?

    12. 12 Glock

      thnx alot, really wanted to created my icon image!

    1. 1 Connected Internet
    2. 2 How to Design a 3D Box Cover for Your Free Ebook or Any Product?
    3. 3 Logo for you blog, does it matter? | Alpesh Nakars’ Blogosphere
    4. 4 Lyte Byte’s New Header and Logo | Lyte Byte

    Leave a Reply




    LyteByte Full Feed

    About Lyte Byte & Me

    Bringing you Tips, Tutorials, and Tweaks on Computers, Internet, Operating System, Windows Vista, Office Applications, Web 2.0, Gadgets, Science, and Technology.
    Its a byte of technology, did you have your byte today?


    subscribe through Email