ACCESSIBLE CSS: EightShapes Contrast Grid

EightShapes Contrast Grid Example

To be in compliance with the WCAG 2.0 Guideline 1.4.3 Contrast (Minimum) (Level AA), the visual presentation of text color against background color has to have a contrast ratio of at least 4.5:1.

Use the EightShapes Contrast Grid to test many foreground and background color combos for compliance with WCAG 2.0 minimum contrast.

The tool’s legend diagram explains the pass/fail codes:

Contrast grid legend

Once you have created a contrast grid that pertains to your project, you can copy the grid HTML and CSS for your use.

Copy HTML and CSS from grid

Take the EightShapes Contrast Grid for a spin.

Instant Download!

PDF Accessibility Remediation How to Fix 40 Common Errors

Whether you have limited experience with the PDF remediation process, are expanding your knowledge on how to remediate PDFs, or simply need a resource that can help remind you how to fix a frustrating error, the info provided in this e-book can help.

Download now.


WEB DEV ACCESSIBILITY: Use Relative Rather Than Absolute Units in CSS Property Values

abstract pixel art design wallpaper background backdrop

Low-vision users, and a lot of people over 50, need to increase the browser default font size to make text easier to read.

If your web content font sizes are set in absolute units, such as pixels, the user will not be able to re-size the text.

Relative units like EM and percentages “stretch” according to the screen size and/or user’s preferred font size, and work on a large range of devices.

Using relative units helps satisfy the WCAG 2.1 Guideline 1.4.4 Resize text Level AA.

Need to convert pixels to EMs?

Use this handy online tool, developed by Brian Cray:


WEBSITE ACCESSIBILITY TESTING & REMEDIATION SERVICES: Mary Gillen is an experienced Website Accessibility Compliance Auditor and Remediator. She can test your website to determine if it meets accessibility standards:

WCAG 2.1: 312 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 59 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos