5 Free Grunge Webdesign Textures

In recent weeks, I started designing my portfolio website at alex.manarpies.com. For this site, I aimed for a neutral, yet “designy” feel and ended up with a grungy blue and brown theme featuring custom typefaces and letter-pressed headings.

I’d like to share the excellent free background textures I used for alex.manarpies.com. It was created by DeviantArt user ‘Princess-of-Shadows and was compiled from scans of actual materials.

Find the original page here.

The image pack features 5 distinct textures with varying degrees of grunginess. You can use them as-is, or bestow some Photoshop wizardry upon them to cook up some custom coloring and effects. I went for the latter approach:

Here’s how I achieved this effect:

1. Set the texture layer to black and white.
2. Set the texture layer’s blend mode to Overlay.
3. Set the texture layer’s opacity to 70%.
4. Create a new layer under the texture layer and fill it with a color, perhaps a shade of pale blue.

It may have come to your attention that the textures won’t repeat especially well when used as a background. However, as they are pretty hi-res, you could give the backgrounds a fixed background position. For instance (CSS):

background-color: #d2e0dd;
background-image: url(bg_site_blue.jpg);
background-attachment: fixed;

Grungy background patterns seem to be in vogue lately, and there’s a lot to be had of them on the net - too.
But, please, don’t kill the effect by mere overzealousness. Moderation in everything, my friend.

Have fun with them and report back with your creation :-).

Comments

[Tweets that mention 5 Free Gru]

[...] This post was mentioned on Twitter by Ace. Ace said: New blog post: "5 Free Grunge Webdesign Textures" (aceontech.com) http://bit.ly/cioKHI #webdesign #free [...]

[Roman Vaizer]

Two Blue Tiles
Blue tiles is a texture that was photographed by my and uploaded for your exclusive use. the original images are blue but with the adding of a Hue and Saturation layer in photoshop you can turn it into whatever color you will need. very high quality photographed as a raw file and converted to jpg.