Skip to content

Contrast checker instructions

Maya Benari edited this page Aug 31, 2018 · 4 revisions

Description

Checks contrast of color grades with a difference of 40 and 50 grades for WCAG 2.0 AA conformance.

Instructions:

  • If pulling down for the first time, be sure to run npm install!

See all failing contrasts between grades within the same color family for all color families

  • npm run check-contrast -- --c

See all failing contrasts between grades in all color families

  • npm run check-contrast -- --ca --d

See all failing contrasts between all grades in a single family, plus white and black

  • npm run check-contrast -- --c --f ${family-name}

Apply gray luminance values to all matching grades in another color family

  • npm run check-contrast -- --al --f ${family-name}

View list of relative luminance values for all colors in a given family

  • npm run check-contrast -- --l --f ${family-name}

To add optional debug output

  • use the --d flag in the above commands