New in Labs: Color Contrast Check in the Accessibility Checker

The color contrast check is still in development and will receive updates as part of Labs. Functionality will change over time. Some options could be modified, while others may be removed based on feedback and feature stability.

The contrast check you’ve been doing in a browser tool? It’s now built into Storyline 360. The new color contrast check in the accessibility checker scans your entire project in one pass and flags every contrast issue, so you can address them without toggling between apps.

Automatically Check Color Contrast

To get started, enable the feature in Labs, then open the accessibility checker from the View tab on the ribbon or select Accessibility Issues in the status bar at the bottom of the app. You’ll see a new color contrast category in the All Issues list, labeled with the Labs icon, alongside your existing checks.

Review and Fix Issues

When the checker detects a contrast issue, it notes the affected object and displays a slide preview so you can see the problem in context. Select any instance in the list to see:

• The measured contrast ratio
• The text and fill colors with color selectors for choosing different colors
• The font size with up/down arrows for adjusting it
• The pass/fail status for regular text (4.5:1 minimum) and large text (3:1 minimum) per WCAG 2.2 Level AA.

Once you’ve selected colors or adjusted the font size, click Apply to save your changes or click Skip to move past an issue without making changes. Use the Previous Instance and Next Instance arrows to navigate between issues.

Color Contrast Check FAQs

What objects does the color contrast check scan?

The checker scans text boxes, interactive text objects, and their states.

Will the checker suggest replacement colors?

Not yet. The color contrast check identifies issues and shows you the text and fill colors involved, but it doesn’t suggest replacement colors. You can update the text and fill colors directly in the checker. We’re looking into automatic suggestions for future updates.

Will the color contrast check be available in Rise 360?

Not at this time, but Rise 360 includes built-in contrast support at both the theme and block levels. Use the theme contrast control to automatically apply contrast to course-wide elements such as headers and progress indicators. For individual blocks, block contrast settings ensure that text and graphics meet the 4.5:1 accessibility ratio when a custom background color is used. If you’d like to see a dedicated contrast check, let us know!

Share Your Feedback

The color contrast check is the first Labs experiment for Storyline 360, and your feedback will help set the tone for how we build and refine features. We need your help to ensure it meets the needs and expectations of all Articulate users. Please share your thoughts on the following topics:

• Uses. How are you using the color contrast check? Does it fit your workflow?
• Bugs. Is anything not working as expected?
• Improvements. How could this feature be better?
• Insights. How does this feature benefit you and your learners?

You can enable and disable this feature using the Labs button on the File or View tab. Share your thoughts in the Labs forum or use the feedback form directly within the feature.