--- title: Color Contrast for More Legible Websites description: Color contrast is a critical aspect to design. If you do not use best practices, people with seeing different disabilities may never be able to comprehend your content. Designing for legibility is not only good practice but when designing for government-sector clients, it's the law! image: https://invent.alextom.com/hubfs/contrast-header-img.jpg --- - [Home](https://www.alextom.com) - [About Us](https://www.alextom.com/about) - [Capabilities](https://www.alextom.com/capabilities) - [Projects](https://www.alextom.com/projects) - [Clients](https://www.alextom.com/clients) [Return to A+T Blog Home](https://invent.alextom.com/blog) # Color Contrast for More Legible Websites - Usability/Design Did you know that according to the World Health Organization, more than [200 million people around the world have some type of visual impairment](http://www.who.int/en/news-room/fact-sheets/detail/blindness-and-visual-impairment)? Be it colorblindness, eye injuries, cataracts, or reduced vision that naturally comes with age, these challenges can make it more difficult for people to read text presented in certain color combinations. ## Color Contrast and Legibility  Color contrast—the degree to which lettering stands out from its background—can be measured. Put simply, the higher the text's contrast, the easier it is to read. When Alexander & Tom, Inc. creates websites, mobile apps and other digital interfaces for our clients, we strive for high-legibility visual design, which gives a better reading experience for anyone with less than perfect vision. Designing for legibility is not only good practice, but when designing for government-sector clients, it's the law! Text on government websites is required to meet or exceed certain thresholds prescribed by the W3C’s (World Wide Web Consortium) Web Content Accessibility Guidelines. ## Example of Color Contrast ![contrast](https://invent.alextom.com/hs-fs/hubfs/contrast.png?width=1020&name=contrast.png) If you'd like to read more about text and color contrast, check out these links: - [Web Content Accessibility Guidelines (WCAG) - Color Contrast](https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html) - [American Disabilities Act - Color Toolkit](https://www.ada.gov/pcatoolkit/chap5toolkit.htm) - [WebAIM Color Contrast Checker](https://webaim.org/resources/contrastchecker/) Written September 13, 2018 by # Antony Casale # [SEO Consulting: What NOT to Do](https://invent.alextom.com/blog/seo-consulting-what-not-to-do) # [WebAwards Gives 3 Honors to A&T](https://invent.alextom.com/blog/webawards-gives-3-honors-to-at) Close # Filter Posts Display By: New to oldest Oldest to newest Name ascending Name descending Tagged: DigitalMarketing VR/AR Programming UX/UI ContentStrategy Submit Clear Close # Search Search Close # Subscribe © Alexander & Tom, Inc. [Careers](https://www.alextom.com/careers) [GSA](https://www.alextom.com/gsa) 3500 Boston Street, Suite 225 Baltimore, MD 21224-5275 [410.327.7400](tel:4103277400) [info@alextom.com](mailto:info@alextom.com)