Gradient background


Well-known member
How do I get a gradient background?

I'm using General -> Body -> Background Settings

Xen Gradient Setttings.PNG

But this doesn't seem to work. The x is correct but the y doesn't go the full distance down the screen.


XenForo moderator
Staff member
If you want it to repeat in both directions then select Repeat.

If the gradient doesn't extend as far as you want, use an image with a larger height.


Well-known member
I don't want to create a new thread for this, so sorry to use this one ;)

I have a bg picture on repeat on a forum. It's light green with dark flowers. I want the page itself to have a gradient from dark in the bottom to normal light in the top.

When I try doing the above, my background image disappear...

I am having the image in the HTML though, but it doesn't matter if I place it there or in the body, the result is the same.

Hope you can help =) Thanks

Jake Bunce

XenForo moderator
Staff member
Can you post a URL to your forum so I can see the problem?

Maybe the background image is being covered by the header area. Also note that the HTML background is normally covered by the Body background unless your body is a fixed width.


Well-known member
Thanks Jake :) That was actually a thought I had too - but if I do it like that, and the image is set to repeat, wont it add some differences in the gradients?

The end result should be as close to the main page as possible, which you can see here (with gradient):


Well-known member
Hm yes, just hoped I could add the gradient with the piece of BG I had on repeat lol.

Well, I just get that image from them instead =)Probably easier lol

Thanks a bunch ^^

EDIT: And done :) works.