Member Avatar for Snowbell

Hi,

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.

browser_window.png 50.32 KB original.jpg 45.46 KB
  • 4 Contributors
  • 3 Replies
  • 125 Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by logoonlinepros
Member Avatar for aljiro

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.

Member Avatar for dennishall

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

Edited by dennishall because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.