Create Web 2.0 Style Logo with Photoshop

Advertisement

In this tutorial i am going to show you how you can create one logo with web 2.0 style.

Note: This tutorial was published before on another small site some years ago. I decided to close that site but i always liked this tutorial and he got a lot of positive reviews. So i decided to update it and publish it here at Photoshop Star.

Final Image Preview

Create Web 2.0 Style Logo with Photoshop

Step 1

Create a new document with size of 600 x 300 pixels and fill it with white color.

Create Web 2.0 Style Logo with Photoshop 1

Step 2

Create a new layer. Select the Polygon Tool, set sides to 3 and on Polygon Options select Smooth Corners.

Create Web 2.0 Style Logo with Photoshop 2

Set foreground color to #91D638 and draw a polygon facing up.

Create Web 2.0 Style Logo with Photoshop 3

Step 4

With layer selected, go to Layer > Layer Style > Blending Options > Stroke.

Create Web 2.0 Style Logo with Photoshop 4

Create Web 2.0 Style Logo with Photoshop 5

Step 5

Create a new layer. Add a white polygon on the center, slightly smaller than the green polygon.

Create Web 2.0 Style Logo with Photoshop 5

Step 6

Create a new layer. Draw another green polygon, slightly smaller than the white polygon.

Create Web 2.0 Style Logo with Photoshop 6

Step 7

With this layer selected, go to Layer > Layer Style > Blending Options and add the following styles:

Create Web 2.0 Style Logo with Photoshop 7

Create Web 2.0 Style Logo with Photoshop 8

Create Web 2.0 Style Logo with Photoshop 9

Step 8

Merge all visible layers into one except background layer. Duplicate layer and rotate upside down and you will have something similar to what i have.

Create Web 2.0 Style Logo with Photoshop 10

Final Image

Now add some text using font Myriad Pro, Semibold, Smooth, 47px and color #888888.

Create Web 2.0 Style Logo with Photoshop

You can see now logo with different colors:

Create Web 2.0 Style Logo with Photoshop 11

Advertisement


  • http://iapdesign.com iapdesign

    Very nice and simple tutorial for creating web 2.0 logo very much appreciated.!

  • http://www.alherabd.com farid

    Professional & i like very much such type of logo.

  • alexhairyman

    Very nice, quick and easy, and doesn’t use illustrator like a lot of tutorials

  • Rakesh

    Very nice……………

  • Cece

    very good, but im having a hard time with duplicating & rotating the pic…

    • Cece

      Never mind.. i figured it out. But good tutorial though!

  • Howdy

    How to rotate? Im trying but it puts error “open gl” is required to appy on document

    • Howdy

      never mind, i got it

  • Tutsnow

    creating an elegant yet minimalist logo takes a lot of discipline… hats off to you mate! great job….

  • braifen

    Thank u for the tutorial, i love it

  • Albert

    great tut!

  • steffenw

    Best detailed tutorials I’ve seen so far. Very usefull

  • Suneel

    it’s great tutorial.

  • Micah

    good tut! 😀

  • CHAOS

    That’s so cool! Thanks1 Fast and professional!

  • ovi

    Thanks.

  • Muhammad Wajid

    nice way and nice designed

Pin It on Pinterest

Share This
Sign up for our Newsletter

Signup today for free and receive all new free tutorials published at Photoshop Star.



Subscribe!