Affordable Website Design - www.affordable-website-design.me.uk or www.awdesign.me.ukClick Here to email Affordable Website Design

Indented Text Effects
Free Articles and Tutorials for Web Designers
www.affordable-website-design.me.uk or www.awdesign.me.uk

GraphicsFactory GraphicsFactory

Tutorial: Indented Text Effect
Software: Adobe Photoshop 6.0
Difficulty: Beginner

This Adobe web tutorial will show you how to create indented style text effects to jazz up your text.

Step 1: Fire up Adobe Photoshop and go to File + New to create a new file image. Set the width and the height to the settings that you want. Remember to make the file image big enough to place your text onto it.

(Step 1 diagram)

New file image

Step 2: Now you will need to fill the image area with a color. Select your color (I used the color blue #4174F6) and fill the area with your chosen color. To do this click on the Paint Bucket Tool Icon >> Paint Bucket Tool Icon or simply press the letter G on your keyboard and then right click inside your image file. Your image file should now look similar to the 'Step 2 diagram' as shown below.

(Step 2 diagram)

Image area colored in using the Paint Bucket Tool

Step 3: Now we will prepare to type text into the image file. Select the type tool by clicking on the T icon >> Type Tool Icon and then choose the Type Mask Layer on the type options bar at the top of Photoshop. The Type Mask Layer Icon looks like this >> Type Mask Tool icon Now click on the image file and start to type your text. (I typed Indented and used the verdana font, however it doesn't matter what font you use.) Once you have finished typing your text click the tick at the top of Photoshop at the right hand side. Your image file should now look similar to the 'Step 3 diagram' as shown below.

(Step 3 diagram)

Type Mask Layer Effect

Step 4: Now we need to create a new layer. Click on the New Layer Icon to add a new layer as shown in the 'Step 4 diagram' below.

Add a New Layer box

Step 5: Select the new layer by clicking on it in the layers palette and then choose your color. (I chose the color black #000000). Now go to Edit + Fill, a Fill box will appear - click OK. Your image file should now look similar to the 'Step 5 diagram' as shown below.

(Step 5 diagram)

Indented image file - black color fill

Step 6: In the layers palette select the original layer and with your keyboard arrows - move the layer down once with the down arrow and then right once with the right arrow. Now go Image + Adjust + Brightness/Contrast and move the Brightness slider to 100% and then click OK as shown in the 'Step 6 diagram' below.

Brightness and Contrast adjuster

Step 7: Now to round it off, go to Select + Feather and set the Feather Radius to 1 Pixel and click OK.

Now to finish it off go to Layer + Flatten Image and then save it to your hard-drive.

The finished Indented Text Effect should now look similar to the below image.

The finished tutorial result

I hope this tutorial was of help.

Article copyright @ webdevstore.com

<< Tutorials           Top of Page           Articles >>


© July 2003 Affordable Website Design - All rights Reserved
Add to Favourites       link To AWD       Disclaimer       Privacy       Tell A Friend