Zymic

Webmaster resources

Follow us on Twitter!

Hosting status updates - Click here

Adobe Photoshop

Free Tutorials » Adobe Photoshop » Invision Borders

Create borders similar to the ones on IPB forums (default skin).

Step 1

Make a new document and make a new layer. Grab the Rectangular Marquee Tool and make a selection similar to the size below.

Step 1 diagram

Step 2

Do not deselect just yet, change your foreground and background colours to the ones below (#6478A0 & #84B9F5):

Step 2 diagram

Step 3

With the selection still in place grab the Gradient Tool and drag from bottom upwards in the selection. Doing this will give you the below gradient:

Step 3 diagram

Step 4

We now need to add the glossy shine to it, this in fact, is very simple to do. Grab the Rectangular Marquee Tool again and make a selection the full width but half the height of the bar.

Step 4 diagram

Step 5

Now make a new layer and fill the selection in with the colour white. Change the blending mode to "Soft Light" and the layers opacity to 36%. Press ctrl+D to deselect.

Step 5 diagram

Step 6

You may be thinking, what's the point in this tutorial.. if I want to create this effect for my forum i'll use the default theme which is identical! Well using this effect doesn't necessary have to be for a forum, you can incorporate it into lots of other interfaces or what ever your wanting to make. Below is an example content box you could make:

Step 6 diagram

Tutorial comments

21.03.2008 -

justinwhite93 says …

Looks great :)

21.02.2008 -

G4 says …

Better then the newer border by lenny

19.02.2008 -

foxer says …

wery good

05.01.2008 -

askemou says …

nice enough!

28.10.2007 -

sagm999 says …

Basic, but essential.

View all user comments for this tutorial.

Tutorial statistics

Date added:
05.01.2005
Author:
Zymic
User rating:
5/5
Rate tutorial:
Total views:
11212
Total comments:
5

Advertisements