Storyline 360: Modern Player Custom Color

Article Last Updated

This article applies to:

There may be times you want to use a custom background color for the modern player. It's a great way to further personalize a Storyline 360 course or match your brand colors seamlessly.

Starting with the July 2021 update, you can easily change the background color for the modern player with your color of choice. Here’s how.

  1. Go to the Home tab on the Storyline ribbon and click Player.
  2. When the player properties appear, make sure the Player Style is set to Modern. (Learn more about choosing a player style.)
  3. Click Colors & Effects on the ribbon, then click Custom to choose your background color. It’s that easy!
Player properties window

Note: Click Custom to access the background color selector. It's grayed-out for the built-in dark and light themes.

Learn how to customize all the player settings in Storyline 360.

And as seen below, Storyline 360 instantly adjusts the contrast on player elements based on your custom background color choice to maintain visual contrast.

The contrast on player elements adjusting to the custom background color choice..

Note: When you choose a dark custom background color, the player controls use hex color code #BABBBA. When you choose a light custom background color, the player controls use hex color code #585858. Make sure your custom background color has a contrast ratio of 3:1 or higher against the player control color so learners with low vision can read it. To easily determine the contrast ratio, try this web-based contrast checker or download this contrast checker tool.

Compatibility

When you open Storyline 360 project files that use the modern player with a custom background color in Storyline 3, players return to the classic style and default color scheme.

When you open Storyline 360 project files that use a custom background color in earlier builds of Storyline 360, players return to the light modern player theme and default colors.

Learn more about compatibility.