How to Create a Soft Grunge Photoshop Brush
The use of soft or subtle textures in web design is very common right now. Extremely grungy designs with heavy textures are still used in some situations, but a more subtle use of textures has become much more common. These softer textures are ideal for website backgrounds or for applying to specific elements within a design.
One of the easiest ways to use textures in your designs is with the help of Photoshop brushes. There are countless pre-made brushes available, but sometimes you won’t be able to find exactly what you want, or maybe the brush that you want to use isn’t licensed for a commercial project. In these situations you can simply create your own set of brushes and use them whenever you need a subtle texture.
In this tutorial we’ll go through the process of creating a soft or subtle grunge brush. Of course, you can duplicate the process and create a full set of brushes if you like the outcome.
Here is a preview of the texture that will be created by this brush:
To get started, you’ll need a few texture photographs. For the tutorial I’ll be using 3 photos from our set of Subtle Concrete Textures that is available to Vandelay Premier members. You can use whatever textured photographs you like, preferably high resolution. It’s best for this purpose if you can find some that have a nice texture without extreme roughness or contrast.
Here is a look at the 3 photos that I’ll be using:
Create a New File
The maximum size for a Photoshop brush is 2500 pixels x 2500 pixels, so that is what we will be working with. Whenever possible it is good to create large brushes because you can always reduce the size when you use them. So create a new file that is 2500 pixels by 2500 pixels.
Working with the Textures
When we create the Photoshop brush it will basically ignore the color, so it is easiest to desaturate the images first so you can see it more accurately as you are working. So take each of your 3 (or however many you are using) textures and desaturate them (Image > Adjustments > Desaturate). After they are desaturated, paste each one of them into the new file that you created. This will create 3 new layers, 1 for each texture.
The first layer will just be the first texture that you paste in. Mine looks like this:
Then with the second layer, double click on the layer in the layers palette and set the blend mode to “overlay” and the opacity to 100%. The result will be a combination of the first 2 textures:
Then do the same thing with the third layer to set it at “overlay” and 100%.
This gives us a light area at the top, which will be good for blending it to make a subtle transition with the background.
Adjust the Levels
The next step is to adjust the levels, which will help to bring out the darker areas and to make the light areas even lighter. To get to the levels options, go to Image > Adjustments > Levels. The specifics of how you adjust the levels will depend on the images that you are working with. For my images I am bringing the two outside levels in a little bit towards the middle, which will lighten the lighter areas and darken the darker areas. And I’ll also move the center (gray) level to the right which will darken the image a little.
After adjusting the levels my image looks like this:
Use the Lasso to Make a Selection
Creating brushes with blocky edges is fine, but having at least one soft edge makes the brush a little more versatile because you make make it fade or blend to the background color. So we’ll create a soft top edge to our brush, and the first step of is accomplishing this is to make a selection with the lasso tool. This step isn’t absolutely necessary, but it helps to create a more varied top edge to the brush.
Copy all layers within the selection (Edit > Copy Merged) and paste it into a 2500 pixel by 2500 pixel file with a white background.
Apply a Gradient
Set the foreground color to white and select the gradient tool. Make sure it is set to a linear gradient that fades from white to transparent. Apply the gradient to the top of the image with the white part of the gradient at the top of the image.
Touching Up the Edge
Our top edge still has a bit of an outline to it, and we want to to fade to white, so it will need a little work. Create a new layer. With the foreground color still set to white, select a brush for touching up the top edge. You could use the default spatter brushes that come with Photoshop, but they are very small and it will take a long time. I like to use an existing grunge brush. In this case I’m using one of the brushes from our first set of soft grunge brushes at Vandelay Premier. I’m just applying that soft grunge brush at various spots around the top edge of our image until the result is a gradual fade to white with no noticeable lines. Here is an up-close look at the result:
And here is the entire image:
Our image is now ready to be saved as a brush. Go to Edit > Define Brush Preset to give it a name and save it.
The brush is now ready to be used whenever you need a soft texture. Here is a look at a few samples that I quickly created by just using the brush on a sold background (the images are at 100%, so you are only seeing a small portion of the brush). You can get varied results by using multiple brushes on top of each other, adjusting blend modes and opacity, or experimenting with darker and lighter uses of the brush.
Creating brushes can be a lot of fun, and it gives you a library of brushes to use whenever you need. If you’d rather not create you own brushes, you may be interested in some of the sets that are available at Vandelay Premier: