Want the modern player to align with your brand? You can replace the default background color with any color and ensure it works for all learners by checking the contrast with the player controls. Read on to learn how.

• Customize Modern Player Background Colors

• Check Color Contrast

Customize Modern Player Background Colors

To set a custom background color for the modern player, follow these steps:

1. Go to the Home tab on the ribbon and click Player.

2. Make sure Player Style is set to Modern. (Learn more about choosing a player style.)

3. Click Colors & Effects, then select Custom.

4. Choose a background color from the color selector. 

Note: The color selector is available only when using the Custom theme.

Check Color Contrast

To ensure your background color is accessible to all learners, check its contrast against the player controls. Storyline 360 automatically adjusts the player controls to light or dark mode based on your background color:

• When using a dark custom background color, the player controls use hex color code #BABBBA. 

• When using a light custom background color, the player controls use hex color code #585858. 

Use a contrast checker to verify that your background color has a contrast ratio of at least 3:1 with the player controls before publishing.