Hostinger AI Builder: How to change the section background in manual mode

Change the background of a section on your Hostinger AI Builder manual mode website, using a color, gradient, or image.

Change the section background

Within the builder, click on the section you want to edit and select Edit section:

If you wish to use an image background, you may also click on Generate image right away

Choose between color, image, or video:

Color background

Image background

Video background

Click on the color bubble and set any color you like.

You can also set a gradient background color. Two gradient types are available:

Linear gradient — color transitions in a straight line (e.g., top to bottom, left to right)
Radial gradient — color radiates outward from a central point, creating a circular or elliptical effect

Click on Add image or Replace image and select an image from the media library, upload your own image, or browse the free image gallery

After setting a background image, you can also:

Change the overlay opacity until you’re happy with how dark or light your section’s background is
Enable fixed background, which means that the background image will remain fixed (won’t scroll) when scrolling the page

Click on Replace video and select a video from the media library or upload your own

After setting a background video, you can also:

Change the overlay opacity until you’re happy with how dark or light your section’s background is
Enable fixed background, which means that the background video will remain fixed (won’t scroll) when scrolling the page
Adjust the position of the video within the section

With background color, you can also configure it to be gradient as shown below:

It is not recommended to use GIFs for a section background because they may affect your website speed.

If you want to add video background to sections, you would need to add videos in GIF format inside your editor, more details here.