@pbroom/color-kitContrast

meetsAA

Returns whether two colors meet WCAG 2.1 level AA: a contrast ratio of at least 4.5:1, or 3:1 when largeText is true.

functionimport { meetsAA } from '@pbroom/color-kit';metrics.ts:332
function meetsAA(
  color1: Color,
  color2: Color,
  largeText?: boolean,
  options?: ContrastOptions,
): boolean;

Parameters

color1Color
First color (order does not matter).
color2Color
Second color.
largeText?booleandefault false
Apply the large-text threshold (3:1).
options?ContrastOptions
Display gamut and channel precision, as for contrastRatio.

Returns

boolean

Throws

  • When options.gamut is not 'srgb' or 'display-p3'.

Example

TypeScript
import { meetsAA, parse } from '@pbroom/color-kit';

meetsAA(parse('#777'), parse('#fff')); // → false (≈ 4.48:1)
meetsAA(parse('#777'), parse('#fff'), true); // → true

See also