Colors
colorIsReadable

👓 Checks if the contrast between two colors meets WCAG standards.

Syntax

import { colorIsReadable } from '@opentf/std';
 
colorIsReadable(color1: any, color2: any, level?: 'AA' | 'AAA' | 'AA_Large' | 'AAA_Large'): boolean
  • level: The WCAG level to check against (default: 'AA').
    • 'AA': Minimum contrast ratio of 4.5:1.
    • 'AA_Large': Minimum contrast ratio of 3:1.
    • 'AAA': Minimum contrast ratio of 7:1.
    • 'AAA_Large': Minimum contrast ratio of 4.5:1.

Examples

colorIsReadable('black', 'white'); //=> true
colorIsReadable('gray', 'white'); //=> false
colorIsReadable('gray', 'white', 'AA_Large'); //=> true

Try

colorIsLightcolorLighten