import { apcaContrastValue } from "https://deno.land/x/a11y_color_contrast@v0.2.0/apca.ts";
This function calculates the contrast value between two colors based on WCAG contrast readability criteria. The first color is the foreground color and the second the background color (defaulting to pure white, "#fff" / [255, 255, 255]).
NOTE: The returned value is signed, but only the absolute value matters, so you
may want to wrap the result in Math.abs
. The reason for this is that light on dark
colors returns negative numbers, while dark on light returns positive numbers.
import { apcaContrastValue } from "./apca.ts";
apcaContrastValue([26, 26, 26], [255, 255, 255]) // black on white
// 104.3
apcaContrastValue([255, 255, 255], [26, 26, 26]) // inverted from above
// -106.55
See https://github.com/Myndex/SAPC-APCA/ for concrete details for APCA.