Color, gradient, image, video, and iframe backgrounds

A striking background can set the mood of a slide before anyone reads a word. Use a color, gradient, image, video, or embedded web page behind your slide content. Select Slide backgrounds in the right-hand toolbar to choose a background type.

Background fill

Open Fill to give a slide a solid color or a gradient. Choose Solid, Linear, or Radial at the top of the panel.

A solid background color fills the entire slide. If you combine it with a background image or video, the color appears beneath the media, which lets you control the color of any letterboxing.

Gradients

Choose Linear and set the angle, or Radial and choose where it's centered.

The strip below previews the gradient, with a handle for each color stop:

• Select a handle to change its color and opacity.
• Drag a handle to move the stop.
• Click the strip to add a stop.
• Press Delete or Backspace to remove the selected stop.
• Select the reverse button to flip the order of the colors.

A slide can have a gradient or background media, but not both. Applying one removes the other.

Default background and priority order

Every Slides presentation has a base color theme that sets the background color for the entire deck. Pro and Team users can override it with the CSS editor, and individual slides can 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

A slide gradient is displayed above all of these. Any transparent parts of the gradient let the color beneath show through.

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.

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 video

A background video plays automatically when the slide appears. Slides supports all standard video formats and files up to 100 MB.

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

Background iframe

An iframe background displays 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.