Color Blindness Compliance/WCAG Accessibility Tools
I would like to see an ON/OFF switch to test for color conflicts with regard to 508 compliance.
This is valuable to me because I design for a large company and we need to make sure that everything tests fine against 508 compliance, which includes color conflicts for color blindness and deficiencies.
While we still don’t have the tools built right into XD (and so I’m leaving this open), we do have at least one plugin to help with color blindness checking. Please do check out the plugins section of XD to see if one will work for you!
-
Vlad Iepure commented
Please include an in-app WCAG Contrast Checker—very much needed in order to be web compliant these days. See Webflow example (attached screenshot).
Thanks
-
Anonymous commented
A plugin to test our designs for all accessibility measures. Like in Sketch.
-
Mahmod Issa commented
Stark integrated in XD. http://www.getstark.co
-
Maiquei Prote commented
Gostaria muito de ver integrado ao XD uma ferramenta que verifica se as cores aplicadas ao projeto estão em conformidade com as limitações de pessoas daltônicas, assim como este exemplo:
https://apps.apple.com/us/app/sim-daltonism/id693112260?mt=12
-
Mileine Siqueira commented
i hope this be implemented very soon.
-
Maria Julia Guimaraes commented
I saw recently and installed this plugin, called Stark. It's a good start, it's helpful.
-
Pavel Cerny commented
It can work similarly as the spellchecker. When text is on not-enough-contrasting background underline it with green wave.
-
Pavel Cerny commented
It would be amazing to contain a possibility to validate the AA, AAA color compliance.
Or even integrate this tool http://accessible-colors.com/. This tool recommends, how I can change font color or background color to increase the contrast while maintaining the color tone. Integrate it into XD and users will immediately produce more usable designs.
-
Pieter Delbeke commented
This needs to be voted up faster. Manually checking this every single time is so time consuming. And you don't want to send a design to a client where the contrast is off.
Some designers (and I understand this because its a natural behavior) don't even look at it while working and then it's not confirm to the standards. Changing the colors later on in the workflow is not making your client happy.
Please look at this adobe!
-
Ryan D commented
Here is a Sketch Plugin that does this. Would be nice to not have to exit the application to know the level of compliance.
https://github.com/getflourish/Sketch-Color-Contrast-Analyser
-
Maria Julia Guimaraes commented
I'd like to have in the preview mode a functionality where we can setup proof colors to evaluate colorblindness compliance, following what is already available in other Adobe tools like Photoshop, Illustrator.
-
lesleys commented
Build in a manual colour contrast analyzer or better still, have an auto feature that alerts you when a contrast issue is present. Ideally the user would be able to turn it on and off and set the contrast requirement to meet either AA or AAA requirement.
-
Bruno Alves commented
I am looking for an easy solution inside Adobe XD as well. Today I need to use color contrast checker like https://webaim.org/resources/contrastchecker/
-
Jennifer Hauschild commented
Me too! I work for a small advertising agency, and we make sure all of our websites are WebAIM AA level compliant as well as check for color blindness readability.
-
Tess commented
I was looking at the option at least to turn on the black & white preview regime instead of using an export and additional software.
-
Dave Nelson commented
I would like to see "Audit" feature that would check for contrast and color accessibility guidelines in the entire project along with a way to audit a grouped object.
It worries me that the demos and example prototypes are full of content that does not meet the WCAG 2.0 AA guidelines for color and contrast.
-
Anonymous commented
This would be an amazing feature to have, it would make things very easier on our end
-
Pieter DK commented
Would be great to have Stark integrated in XD.
http://www.getstark.co -
Mike Chambers commented
More info here: https://www.w3.org/WAI/intro/wcag
-
Mike Chambers commented
Provide accessibility contrast information (A, AA, AAA) for text from design view within Adobe XD.
For an example, see:
http://jxnblk.com/colorable/demos/text/?background=%23000000&foreground=%23FFFFFFThis is useful / required when building applications that must meet corporate and / or accessibility requirements about minimum contrast for text.