Banding on Web Gradients

[Digital Skraps]

Does anybody know how i can fix the banding problem for dark grey to black on the web?

i made a large radial gradient for a BG and the banding is terrible. its very subtle in terms of color but the banding is still visible defeating the whole purpose of being subtle.

any help?

[surelock]

Possibly up your dpi or save as a higher quality.

[thunderhawk6630]

You need to tell us what image type your are saving it as, this is probably the root of the problem. Secondly, how much did you compress it. And thirdly how large is the image / what are you using it for. If it is for a background, what you should do is create a new document in photoshop (say 800×800, the most important value is the height, dpi you can leave at 72). Go ahead and create your gradient until you are happy with the result. Then crop the image width to 1px but leave the height the same. Save for the web as a jpg, but leave the quality at 100. Then use the css property repeat-x and you will have a nice gradient.

This will only work for linear gradients, a radial you will have to use a full size image.

Just post a screen capture and we can help you better.

[azteck2]

You could also add some noise to the gradient in Photoshop! It’s under the Filter/Noise menu.

[Author]

Posts