VirtualClues.com - Web Design Training
Movie Library Downloads Photos Blog Archived Tutorials  

VirtualClues Blog > Creating Cartoon Text in Fireworks

Cartoon Text

Cartoon Text Tutorial

Creating "cartoony" looking text in Fireworks requires just a few steps. Like all text effects the font styles you choose will largely determine how good the effect is going to look. Obviously, for cartoony text, you'll want to choose a loose, fun, kid friendly font. A good one is Poornut which you can download from Fonts101 for free. This is the font style that I have chosen for this example.

Properties

As you can see from the above image there are three filters applied to the text: Inner Shadow, Glow and Drop Shadow. However, before we start getting crazy, we'll need to adjust the text a bit for the effects to overlap and appear correctly.

1. Type out "cartoon", fill with #99FF00 (a bright green), make it bold, and size it up to 90.

2. Adjust the kerning to -2 and choose "System Anti-Alias" for the anti-aliasing level.

3. Give the text a white stroke:

Pencil, 1-Pixel Soft, Size 2, Outside Path

stroke

This is what you should have at this point:

Now, we're ready to add the effects!

Inner Shadow:

Inner Shadow

Glow:

Glow

Drop Shadow:

Drop Shadow

 

And this is the end result:

Cartoon Text Tutorial

 

***We break this tutorial for this important message. Upon viewing the end result of this tutorial, I thought I'd spruce it up a bit with one more adjustment! This is completely optional depending upon what you prefer but I thought I might as well add this alternative look.


(Same text after adjusting the Levels.)

I really didn't care for "smudgy" details of the beveled raised edges of the original cartoon text so I adjusted the Levels to brighten up and even out the colors in the text.

Levels


Copyright 2005-2007. VirtualClues.com

Home | Resources | Site Map | Contact Us | About Us | Terms | Membership FAQ's