Web Graphics Adobe Photoshop Tutorials

Design a folder web icon
In this tutorial I'll show you how I design a simple but professional looking Folder web icon in Photoshop.

Header Creation
In this tutorial we will be creating the header for our layout.

Classy Header
In this tutorial we are going to create a simple, clean business header that will work great for nearly any professional business website.

Abstract Grunge Effect
In this tutorial l will show you how to utilize photoshops layer options to create an easy abstract/grunge background that is very popular for personal sites, wall papers, and even signature backgrounds.

Vista Sidebar
This very useful tutorial will show you how to create a vista sidebar.

Sleek Menu Bar
Make a sleek menu bar, very shiny stuff for your web 2.0 templates.

Art Gallery Navigational Header
This tutorial will teaches you how to Create a navigational header for an art gallery.

Creating a Girly Heart Header
In honor of Valentines Day I wanted to offer a Photoshop tutorial on making a cute and girly love heart header .

Effective Header
Can't get that header navigation the way you want? Well I'll explain you how to create a simple and effective header in a few steps which wont take long to understand.

Metal Encasing
Adding a metal encasing around your logo can add some extra spice. In this tutorial, we'll walk through the steps for creating a red metal encased logo to use in your websites or graphic design projects.

Geometric Background Patterns
When the design is finished and you're about to start the coding process, you have to prepare your graphics. If you're working with a pattern background you need to export only the repeating fragment. It can be a bit tricky to isolate a fragment to achieve a seamless pattern background.

Glass Toolbar
If you plan to create a web page with glass effects, the best looking effect is the magnifying glass effect, because it looks like rounded pieces of glass floating over text. This tutorial will present you a nice toolbar created with this effect, but the techniques presented here can be used for buttons and other controls too

Windows 7 Navigation
Hello, welcome to another tutorial by hv-designs. In todays tutorial il be showing you how to replicate the windows 7 taskbar, only this taskbar will be a navigation bar for a website. In another tutorial il be showing you how to code it.

Creating a website header in Photoshop
Learn how to design and create a slick website header graphic using Photoshop's Layer Styles, Shapes and Brushes!

Gift Shop Site Logo
Gift Shop Site Logo: Start by creating a rectangle using rectangular shape tool.Enable "subtract from shape area" at the top bar. Create a line using line shape tool. We used a pixel width of 2 pixels. Press Ctrl+T. Right Click and select distort. Adjust the nodes to get a shape as shown.

Cool Product Description Box
Cool Product Description Box: Create a rounded rectangle using rounded rectangle shape tool. Enable subtract from shape area at the top bar. Create a rounded rectangle using rounded rectangle shape tool. Double click the layer to open layer style window. Apply settings as shown ...

Techno Metallic Web Button
Techno Metallic Web Button: Create a rectangle using rectangular shape tool. Double click the layer to open layer style window. Apply settings as shown. Duplicate the layer twice. Scale down and place one on top and another on bottom as shown. Move these layers below all the layers in layer order in layer palette.

Nice fresh green navigation
Design a Nice fresh green navigation

Star Sign Symbols - GEMINI
Star Sign Symbols - GEMINI, Start by applying a solid color to the background layer. Double click this layer in layer window to unflatten it. Double click the layer to open layer style window. Apply layer style with the settings shown. Using custom shape tool create a preset 5 pont star shape. Populate the background with stars ...

Simple White Glossy Navigation
Create a simple white glossy navigation with yellow rollover effect and a search bar