Skip to content

Screen backgrounds

How to give a screen a background colour, gradient or image, and keep text readable over a background image.

How do I add a background colour, gradient or image to a screen?

In the new course builder, select Background in the toolbar under the screen you're editing. The Background panel opens with three tabs: Color, Gradient and Image. What you choose applies to that screen straight away, and Reset takes it back to your theme's background.

How do I set a background colour?

  1. Select Background in the toolbar under the screen.
  2. Open the Color tab.
  3. Pick one of your Theme colours or Saved colours, or add your own.

How do I set a gradient?

  1. Select Background, then open the Gradient tab.
  2. Pick one of the Presets, or build your own.
  3. Choose a Style: Linear or Radial.
  4. Set the Start and Stop colours, then adjust Rotation and Position until the Preview looks right.

How do I use an image as the background?

  1. Select Background, then open the Image tab.
  2. Choose where the image comes from:
    • Library: images you've uploaded or used before. Select Upload to add a new one, or use Search library.
    • Generate: describe the image you want, choose a style (Auto, Photo, Cinematic, Drawing, Vector or Painting), then select Generate. This counts towards your AI image generation allowance.
    • Stock: search Pexels for photos or Giphy for GIFs.
  3. Select an image to apply it.

The image covers the whole screen and is centred.

How do I keep text readable over a background image?

With an image background in place, select Image options at the bottom of the panel:

  • Background blur: softens the image so text on top stands out.
  • Overlay: a slider from 0% to 90% that sets how strongly the image is darkened behind your text.

Can I change the background in the Classic builder?

Yes, with fewer options. Select Background color in a screen's toolbar to change its colour, or Reset background to undo it. On screens with a Slide layout menu, choose Image behind, select Add background image, and use Overlay opacity to keep text readable. Gradients and background blur are in the new course builder only.

Frequently asked questions

Does the background apply to every screen?

No. It applies to the screen you're editing. Set each screen's background separately, or select Reset on a screen to use your theme's background.

What's the difference between a screen background and a block colour?

A screen background fills the whole screen behind all its blocks. A block colour fills just one block, which helps a single piece of content stand out.