Storyline 3: Changing the Player Colors, Font, and Font Size

Personalize the player frame around your slide content with colors and fonts that complement your course design or match your brand.

Note: Player colors and fonts only work on desktop and laptop computers—except the captions font, which works on all devices, including tablets and smartphones. See this interactive demo to know which player properties work on mobile devices.

• Working with the Player Colors and Font
• Switching to a Different Player Color Scheme
• Customizing a Color Scheme
• Resetting a Modified Color Scheme
• Saving a Custom Color Scheme
• Deleting a Color Scheme
• Changing the Page Background Color
• Changing the Player Font
• Changing the Player Font Size
• Changing the Captions Font
• Saving Player Changes

Working with the Player Colors and Font

To change your player's colors and font, go to the Home tab on the Articulate Storyline ribbon and click Player.

When the Player Properties window appears, click Colors & Effects on the ribbon.

Switching to a Different Player Color Scheme

The color scheme selector shows the name of the color scheme you're currently using. The preview area on the right side of the window shows what your player would look like if it were published with that color scheme. You can see how different color schemes look by choosing schemes from the drop-down.

Customizing a Color Scheme

Here’s how to create a custom color scheme:

1. Click Show advanced color editing to reveal additional color options.
2. Use the Edit item drop-down to choose the portion of the player you want to change.
   
   Tip: Download this job aid to identify which player colors affect each player element.
3. Use the color selector to choose a new color. (If you see top and bottom colors, it means the item is a gradient composed of two colors.) If you don't see the color you want, click More Colors to specify a custom color.
4. To apply transparency to the item you're modifying, enter a percentage in the Transparency field. (Transparency isn’t available for all items.)

Resetting a Modified Color Scheme

If you've modified a color scheme and want to undo those changes, click the Reset button.

Saving a Custom Color Scheme

Custom color schemes are saved with your project files. However, they won't be available for other projects unless you save them separately.

To save a custom color scheme, click the Save button, give it a name, and click OK.

Saved color schemes are stored in your project files and in the following directory on your computer:

%AppData%\Articulate\Storyline\3\Frames\StoryFrame\ColorSchemes

Deleting a Color Scheme

To remove a custom color scheme, select it from the Color scheme drop-down, then click the Delete button.

The deleted scheme will no longer appear in your color choices. However, if you delete a color scheme that's applied to another course, it won't be removed from that course—it'll just be stored in that particular project file.

Tip: Built-in color schemes can’t be deleted.

Changing the Page Background Color

The page background is the color that appears behind the player when learners view your published course. Depending on their browser size and the size of your published course, learners may see this color around the perimeter of your player. If you made the base of your player fully or partially transparent, the page background color will show there, too.

Use the Page background selector to choose a color. The color palette comes from your theme colors. If you don't see the color you want, click More Colors to specify a custom color.

Changing the Player Font

To change the font for player elements, such as buttons and prompts, use the Player font drop-down. Your font selection will show in the preview area on the right side of the window.

Changing the Player Font Size

The default player font size is 100%, but you can adjust it. Just enter a value between 75% and 200% in the field provided.

Changing the Captions Font

Want to change the appearance of your closed captions? Just select a different font from the Captions font drop-down list.

The captions font is supported in the standard desktop player and the responsive mobile player.

Saving Player Changes

When you click OK to close the Player Properties window, Storyline saves your player customizations in your project file.

If you'd like to use the same customizations in other projects, click Current Player on the ribbon and choose Save. Enter a name for your custom player if you're prompted and click OK.

To learn more about the Current Player options, see this user guide.