It’s amazing how much something simple—like thoughtful color choices—can improve the accessibility of your courses. Strong color contrast makes course elements easier to read and interact with. And considering how your design could be perceived by learners with different types of color blindness can help avoid visual miscommunication.

These days there are a wide range of online tools that can help you check how accessible a color palette is. But it can still take some fine-tuning to ensure your color selections are most effective. To help speed things up for you, we’ve created this download with five accessible color themes built right into the Storyline 360 file.

Created with the help of Contrast Grid and Coolors, these themes use high-contrast colors that learners with color blindness can easily distinguish from one another. In this file, you’ll also find a table for each theme that outlines which colors can be used together while maintaining a sufficient contrast ratio.

 

 

Here’s how to use the recommendations from the table to guide your design choices:

  • Using text on a background? Choose any pairing listed as Pass.
  • Is that text 18pt or larger? Your options broaden to both Pass and Large Text.
  • Are you placing two colors next to each other? You can also use combinations listed as Pass or Large Text.

Because design needs can vary, you’ll notice two approaches to the theme accent colors. Some alternate between light and dark colors, making them a good fit for content that features graphs or other tightly spaced design elements. Others use a gradual color shift, offering more options to display text on, but requiring space between each design element. Just choose the type that works best for your situation. 

Like a palette but need a different color order? It’s easy to edit and rearrange the theme. And if you want to swap in some different colors, Contrast Grid and Coolors can help check that your new picks are still accessible.

Explore this project.

Be the first to comment