I was toying with some photoshop brushes and came up with a background where the brushes are filled with gradient. Now, I want to use it for a web site background. Is there any way I can repeat the image in css in a nice way without ruining the effct? I tried the way we use color gradients, but it just looks lousy. Any help will be greatly appreciated. I am attaching my original background and my failed attemps to use repeat! I hope you understand my question after seeing the images. The first one is the original design and second one is after using repeat.

Attachments browser_window.png 50.32 KB original.jpg 45.46 KB
7 Years
Discussion Span
Last Post by logoonlinepros

It probably won't work that way. If you tile the gradient image many times then they will end up as many tiled gradient images(as what your picture has illustrated)

Maybe you can try tiling your image to the x-axis only then have a background that matches the bottom part of your gradient image.


In your CSS, make your...
background-color: black;
...and have your...
background-image: url(filename.type) top left repeat-x;

Edited by dennishall: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.