Graphic Thoughts: Grunge Text Looks Nice!
Posted Jan 31, 2009

It seems that everywhere I look I see cool graphic designs that have a grungy feel to them. Admittedly, I really like them a lot because the “dirt and grit” adds a certain amount of texture to design because grunge can fit almost any style. While there are millions of weathered backgrounds, there are not nearly as many grungy font choices out there. Don’t get me wrong, there are lots of cool grunge fonts in the world of cyberspace, but what if you love a certain pristine font and can’t find a grungy version of it? Well, I’m going to show you how to take crisp and clean and make it tattered and dirty!

Step 1: Type Some Text and Add a Mask
To begin, open up Photoshop, create a new canvas of any size (Ctrl+n on Windows; Cmd+n on the Mac), choose your Text tool (t), and pick any font. It doesn’t matter what font you choose; our No. 1 goal is to screw it up (the look, that is!). Go ahead and type your text on the canvas (I wrote the word “clean” with Arial Black).

As soon as your text is on your canvas you’ll want to add a mask to it. Simply find and click the text layer in your layers palette and then click the little square with a circle in it on the bottom of the layers palette. If you’ve done this correctly you should see a white box beside the text icon in your layers palette (Figure 1, below).

Adobe Photoshop

Step 2: Choose (or Download) a Grungy Brush
The next step we’ll walk through involves using your Brushes tool (b). What we’re going to do is make our foreground layer black (press d to make the color palette black & white; press x to switch foreground/background). Then, we’ll simply “paint” on the mask layer by choosing the mask (the white box that was created on the text layer) and draw on or stamp the brush onto the text layer mask.

If you don’t have a good brush to use, fire up your web browser and head on over to www.photoshopbrushes.com. You’ll find lots to choose from under the brushes link. I’ll be using the “Photoshop Grunge Brushes—set 1” for this example (it’s at the bottom of the long list of brush categories). Download the .zip file and extract it to your hard drive. If you don’t have time to go find a grunge brush, just use any brush found with your copy of Photoshop.

To install a new brush choose the Brush tool (b) and then select the drop-down arrow on the top Brushes window (at the top of your screen). Click the black arrow and then choose “Load Brushes” (Figure 2, below). Now, point to the .abr file you just downloaded to install the new brush.

Adobe Photoshop

Step 3: Stamp the Grunge Brush Onto Your Text Layer
Again, with black as your foreground and the mask (white box) selected in your layers palette, use your brush to stamp the “grunge” brush onto your text layer. As soon as you start stamping you’ll see your text gets all weathered (Figure 3, below).

Adobe Photoshop

If at any time you don’t like what you did, choose white as your foreground and paint right back over the text mask. You’ll see your text go back to a pristine look.

So there you have it—a quick way to grunge up your text. Also keep in mind that there is nothing stopping you from applying this same effect to a photo—just add a mask to a photo layer and use this same technique.

Lance Gray (lance at pixelpops.com) is the chief creative pixelmonkey at PixelPops Design, LLC. For questions, thoughts, or ideas simply email him.