Her

Home Photoshop Tutorials Web Layout Clean Tabbed Navigation

Clean Tabbed Navigation

Author: Crunked-Designs.com Author's URL: www.crunked-designs.com More by this author

1. I am using a new document 340 x 70 pixels and a white background.

2. Create a New Layer.

3. Set your foreground colour to #999999 and your background colour to white #FFFFFF.

4. Using the Rounded Rectangle Tool with a Radius of 10px, draw a shape towards the left somewhere.



5. Now right click on the Shape layer and select Rasterize Layer.

6. Ctrl + Click on the layer to select it.

7. Go to Select > Modify > Contract by 1px.

8. Press Delete to delete the selection.



9. Now right click on the shape layer and select Blending Options and choose Drop Shadow. Copy my settings.



10. Duplicate the Shape layer, and move it next to the current tab.



11. Using the Rectangular Marquee Tool, draw a selection over the bottom of the 2 tabs.



12. Create a New Layer on top of the 2 existing shapes.

13. Fill this selection with #999999.

14. Using a 1px hard pencil, draw a white line just below the top of the grey box. Look at mine if that made no sense.



15. Now just finally add some text using #999999 as your foreground colour. Here is my final!

Clean Tabbed Navigation