When designing a website or blog, you sometimes need a background. You can try to come up with your own, and there is some merit to that, or you can try one of the many online background generators that are available. The following are a few of my favorites.

ZenBG includes a large variety of textures which can be combined with colors or linear gradients. It does generate huge files, though, often from 500kb to 1.5mb.

Background Image Generator from SiteOrigin allows you to layer preselected images over background color, adjusting the pattern intensity and blend mode as you go. The results can be subtle, yet striking:


BgPatterns creates tiled images combining a background and foreground image. You can select a color for each, adjust the angle, opacity, and size. Spend some time playing around with the options, because this generator is highly versatile.

You can generate images like this:m0wsfst

which look really cool when they are repeated.

StripedBackgrounds creates backgrounds consisting of five stripes in your choice of color and size—everything from avatar (128 x 128) to ultrawide screen (2560 x 1600).

This image is 320 x 240, just ready for your iPod.


Background Dotter is very cool and one you have to see to believe. Unlike the other sites listed here, however, it does not have an intuitive way to save the image you generate. In Firefox I have to right click and view the background image and then save it.

This is a small example. You can make a dotted background that goes all the way from the top to the bottom of the page.


Stripe Generator is just that: in generates up to five different stripes in your choice of background color, orientation, and size. Bonus: you can add a shadow to the stripes.


Stripemania is similar to Stripe Generator, but you only get two stripes to play with. Bonus: you can add a gradient to the stripes, which adds depth to your background.


Ribbon Rules Generator by Dynamic Drive is probably my favorite stripe generator. Here is a randomly generated sample, based on a blue color found on this blog. You can actually select up to five colors.


Gradient Image Generator by Dynamic Drive generates gradient images in vertical, horizontal, or diagonal orientations. Here’s a sample:


Tartan Maker generates plaid background images:



The Ultimate CSS Gradient Generator doesn’t generate images. Instead, you use a Photoshop-like interface to design a gradient, and the website provides the CSS you need to generate the gradient without using an image.

Of course, you can always remember that Google is Your Friend, and just search for “background generators” on the Google.

Except for material released under a Creative Commons License: ©2021 Kenneth John Odle All Rights ReservedPermalink for this article: