Resources

Colors

• Accessible Color Generator

  • Put in a background color, and this tool shows you accessible shades of it that contrast enough with text.

• WebAIM Color Contrast Checker

  • The standby checker to measure color contrast ratios between foreground and background.

• Color Review

  • Live testing and updating of color palettes to find one that matches accessibility standards.

• Colorable

  • Another live contrast checker with more options for color adjustment

• Color Oracle to Simulate Color Blindness

  • Check different color blindness conditions for anything on your computer to ensure color schemes still work as intended.

• CloudFlare Accessible Color Palette Generator

  • Generate accessible color schemes from random colors, generates colors, colors pulled from images, and more!

Guides and Patterns

• Patterns & Strategies for accessible web-apps

  • This guide gives good rules to follow for JavaScript applications in general, and specific code patterns to follow for some frameworks.

• Include Components

  • A blog/style guide breaking down common components with walkthroughs on making them inclusively

• Accessible Components with JS

  • Simple and useful accessible components with needed JavaScript