Forum Discussion
Add a reverse colour swatch to the accent (custom colour) to accommodate bright backgrounds
Hi
I wasn't sure where I could add this after looking around the discussion boards so adding as a new discussion item here.
Our subsidiary company has a very bright accent/custom colour (#00ff33). This causes accessibility issues if text on top of it (or the background it sits on) is also a bright colour. See picture attached.
I can and have edited the css styles and html in the scorm file (rezipped and uploaded), but unfortunately the LMS system we utilise (SuccessFactors) will not accept the file after I've edited it. I would also would like to avoid this as the breadth and forecast of publishing on an ongoing process will become a sizable undertaking.
Could Articulate consider adding a reverse colour to the accent/custom colour?
- Hi Mata!Good news! You can now use theme color contrast to make sure that text or icons that appear on top of a theme color meet contrast guidelines automatically.To use this new feature, simply go to the Theme tab, select Colors, and choose one of the following options:
- Auto: Turns text and meaningful graphics to black or white automatically depending on your accent color to meet the minimum accessibility contrast requirements.
- Dark: Turns text and meaningful graphics to black.
- Light: Turns text and meaningful graphics to white.
Once you’ve given it a try, we’d love to hear what you think!
Also adding that I have edited the css and html in test environs in Moodle, Rise and Litmos, and they accept the edited SCORM file. SuccessFactors will not! Ugh...
Hoping this could be added to the Rise feature request list.
Hi Mata!
With the release of the new Themes, text for some elements (such as the Course Title) automatically changes from light to dark as needed to preserve a 3:1 contrast ratio; see more details here.
However, this automatic change of the text color isn't applied to other elements yet, such as in the Continue button or the Numbered List label, see this screenshot:
We'll keep you posted as we update this feature and add more elements covered in the automatic change of text/accent color.
- Hi Mata!Good news! You can now use theme color contrast to make sure that text or icons that appear on top of a theme color meet contrast guidelines automatically.To use this new feature, simply go to the Theme tab, select Colors, and choose one of the following options:
- Auto: Turns text and meaningful graphics to black or white automatically depending on your accent color to meet the minimum accessibility contrast requirements.
- Dark: Turns text and meaningful graphics to black.
- Light: Turns text and meaningful graphics to white.
Once you’ve given it a try, we’d love to hear what you think! Fantastic update! This is great news, thank you.
Could I also request that an adjustment be applied to the knowledge check selection/radio buttons as well? I've attached what the user experiences with our current #00ff33 accent colour.
Thanks very much - kudos to the team for actioning this so quickly.Thanks for sharing your thoughts and suggestion on the accent color for the knowledge check radio buttons! I'll share this with the team and will keep you posted on any updates on this request.
Thanks as well for your kind words; I'll forward this to our team to let them know the new feature is well appreciated. :)
