Travis Bobier
 · Professional Nerd

Setting a Background Image and Color with Themes

In Studio, you can set experience-level themes that will be carried across your entire experience. This includes background colors and images, page advance arrows, menu displays, and carousel settings.

Select Theme (stylized as a paint palette icon) from the menu in the top-right corner of the Studio to open the panel.

Tools in Theme Panel

Background: Sets the color that appears behind each page and outside the canvas dimensions if displayed in a larger space. You can select your background color using the built-in color picker or by entering Hex, RGB, or CMYK values.

Upload image: Sets an image that appears behind each page and outside the canvas. Studio supports a maximum background image dimension of 2048 x 2048 pixels. The image will automatically scale to fill the entire screen and remain pinned in the viewport.

Interface: Defines the background color of arrows, menus, and video controls that appear throughout your experience.

Icon & text: Defines the foreground color of arrows menus and video controls.

Enable arrows / Show menu: Where you can choose to show or hide the navigation arrows and top menu bar of your experience.

Navigation arrows will only display on multi-page experiences. If you remove the arrows, don’t forget to provide users will an alternate form of navigation for your multi-page experience.

Note: Hiding the menu will also hide the social media sharing widget.

Carousel Settings: Allows users to navigate back to the first page by advancing forward from the last page. Additionally, you can create a slideshow functionality by choosing the auto-advance option and specifying how many seconds to display each page.

Reset to Default: Because sometimes you just need to start over.

Helpful Tips

  • It’s essential to make sure the Interface and Icon colors contrast. These elements will appear “invisible” if the background and the foreground are the same color.

  • Proceed with caution when using Auto-advance. Most users prefer to control their own pace.

  • When using this feature, ensure each page's content can be easily understood in the time allotted.