{"id":900,"date":"2022-08-11T07:05:58","date_gmt":"2022-08-11T07:05:58","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2022\/08\/11\/6462732-hostinger-website-builder-how-to-change-the-section-background\/"},"modified":"2026-08-21T04:27:32","modified_gmt":"2026-08-21T04:27:32","slug":"6462732-hostinger-ai-builder-manual-mode-how-to-change-the-section-background","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/6462732-hostinger-ai-builder-manual-mode-how-to-change-the-section-background\/","title":{"rendered":"Hostinger AI Builder: How to change the section background in manual mode"},"content":{"rendered":"

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

Change the section background<\/h2>

Within the builder, click on the section you want to edit and select Edit section<\/b>:<\/p>

\"Hostinger<\/div>
\n

If you wish to use an image background<\/b>, you may also click on Generate image<\/a><\/b> right away<\/p>\n<\/div>

Choose between color, image, or video:<\/p>

\"\"<\/div>
\n\n\n\n\n
\n

Color background<\/b><\/p>\n<\/td>\n

\n

Image background<\/b><\/p>\n<\/td>\n

\n

Video background<\/b><\/p>\n<\/td>\n<\/tr>\n

\n

Click on the color bubble and set any color you like.<\/p>\n

You can also set a gradient<\/b> background color. Two gradient types are available:<\/p>\n

    \n
  • Linear gradient<\/b> — color transitions in a straight line (e.g., top to bottom, left to right)<\/li>\n
  • Radial gradient<\/b> — color radiates outward from a central point, creating a circular or elliptical effect<\/li>\n<\/ul>\n<\/td>\n
\n

Click on Add image <\/b>or Replace image<\/b> and select an image from the media library, upload your own image, or browse the free image gallery<\/p>\n

After setting a background image, you can also:<\/p>\n

    \n
  • \n

    Change the overlay opacity<\/b> until you’re happy with how dark or light your section’s background is<\/p>\n<\/li>\n

  • \n

    Enable fixed background, <\/b>which means that the background image will remain fixed (won’t scroll) <\/i>when scrolling the page<\/p>\n<\/li>\n<\/ul>\n<\/td>\n

\n

Click on Replace video<\/b> and select a video from the media library or upload your own<\/p>\n

After setting a background video, you can also:<\/p>\n