10 Quick & Dirty Tricks for Easy Custom Web Backgrounds

Oh, the trials and tribulations of making your own repeating background.  We’ve all been there, tweaking our pixels and trying to make the repeats fit together just right.

Here are the solutions for our background woes!  Take a look at these Web sites that offer you the ability to quickly make your own.  Or you can use one of the seamless repeating images available on the other sites, all polished and ready for your web needs.  You may find some of these backgrounds to be especially inspiring!  I know I have. 

So let’s get started  with 10 Quick & Dirty Tricks for Easy Custom Web Backgrounds.

BG Patterns

This site has some impressive options for making your own background.  There is a large selection of graphics to choose from for the repeating design.  It doesn’t end there, they give you endless possibilities.  You can select your ‘canvas’ style which changes the 3D texture of the background as well as the size of the block and texture opacity.  The color selection page comes with a RGB color chooser and even a place to put your hex code in so you can perfectly match your website design.  You can even apply the image to the page’s background to see how it looks.  Then download the image or save it to ‘my patterns’.

2) Pixelknete’s Background Dotter

Pixelknete can give your website a Pop Art/Lichtenstein look.  The dot style shading can be added to your background as a horizontally repeating image and it looks fantastic.  Just put in your hexes and hit ‘OK’ and it generates your image for you!  Or try hitting ‘random’ and create something wild and funky.  Some of the combinations that came up were really nice.  Once you’re done, right click on the background and select ‘view background image’ in firefox or ‘save background image’ in IE.

3)  Stripe Generator

Exactly what it says it is!  A stripe generator with some pretty amazing options.  Hex code color selection with an RGB eyedropper if you choose to use it, change the size of the 2 different colors of stripes, change up the background, add a gradient, change the gradient height…whew!  Just remember to click the square every time you make changes so it will refresh and show you what the new change looks like.  You can also see other people’s stripe designs, save your own and even make a tartan with your colors!  Speaking of tartans…

4) Tartan Designer

Tartan designer was put together by the same folks at Stripe Generator.  It has similar fantastic options with a fun UI for you to play with.  Mess around with everything, there are some great features!   The resulting textures are great too, just a hint of a textile look that really punches up the style.

5)  Striped Backgrounds

Another stripe based background creator but very different from Stripe Generator.  You can choose up to five different colors using their hex codes or you can just hit ‘randomize’ and see what you get.  An extra bonus is getting to choose the size of the image you want with a helpful drop down guide that lists pixel widths and heights.  Very nice!

6)  bgMaker

A fun little way to make and test your pixel based backgrounds.  Watch it change as you add new colors and pixels!  Your options are fairly limited but you can save your image and browse other saved images and download them to use.  Some of them are really nicely done!  Also their RGB sliders are easy to use and if you make a mistake you can hit CTRL + Z to undo.  Very handy!

7)    Hip and Twendy

A really cool little site with a nice selection of downloadable backgrounds for use on blogs or twitter or whatever you need.  You don’t make your own here but you are sure to find some great ones.

Hot Bliggity BLOG

“the best free blogger backgrounds site on the entire interwebular planet. No exaggeration.” So they say!   And so far it’s holding up pretty well, they have some really beautiful backgrounds here, perfect for your blog.  I love the selection and the textures they use look almost touchable.  You can even hotlink to them using their provided code  or download an extra large .jpg and adjust it to your site exactly how you like.

9) Mel’s Brushes

I remember Mel’s work from back in my young web designer days.  She does excellent brush work and she’s expanded on her skills and now makes repeat patterns as well as other things.  She has a very nice selection, some are for sale and others are for free.  Don’t forget to check her other free resources on her page.

10)  Squidfingers

Travis Beckham offers some really stunning patterns for his site visitors.  150+ designs and counting!  Beautiful pixel work, from mod to Victorian looking designs.  He’s amazingly talented, I spent a lot of time on there!

If you’re really looking to get your hands dirty and try your own here is a nice ‘draw it yourself’ seamless pattern tutorial by Julie that can be mimicked easily in photoshop or illustrator.  You can try this tutorial with real life patterns and textures too by hitting Texture King and getting some of their amazing free textures.

Keep in mind as you visit these sites that they may all have different usage policies on their backgrounds.  Happy background making!