Slide backgrounds

Slide backgrounds let you include media with a large visual footprint behind your slide content. To insert a background, click on the slide background icon in the top right corner. This will bring up a menu where you can select which type of background you want to add.

Slide background controls in the editor

Background color

A solid background color behind the full slide. If you combine this with a background image or video the color will appear beneath, allowing you to control the color of letterboxing.

Default background and priority order

All Slides presentations have a base color theme that sets the background color for the entire deck. Pro and Team users can override this through the CSS editor, and individual slides can also have their own background colors.

There are three ways to define a background color, applied in this order from lowest to highest priority:

  1. Presentation background color
  2. Custom CSS using .slide-background { background-color: ... }
  3. Slide-specific background color

If you use custom CSS, Slides adds a has-light-background or has-dark-background class based on the selected color. Use these classes to adjust foreground colors for contrast.

Choosing a slide background color

Background image

Upload a JPG, PNG, GIF or SVG image to use it as a background.

After uploading an image, choose how it should scale:

  • Cover: Fills the window; parts of the image may be cropped.
  • Contain: Makes the image as large as possible without cropping.
  • Original: Displays the image at its original size.

Background image sizing options

Background video

Automatically play a video behind this slide when it appears in view. We support all standard video formats and files up to 100 MB.

Background videos are muted on iOS because those devices do not allow unmuted autoplay.

Video selected as a slide background

Background iframe

Iframes include content from another website, such as a spreadsheet, YouTube video, or Google Map.

Backgrounds are not interactive by default because foreground slide content is placed on top. Enable Interactive to interact with an embedded background, such as dragging a map. This disables interaction with foreground content on that slide.

Interactive option for an iframe background