Comprobador de contraste WCAG con sugerencia de color

1const lineas = require("fs").readFileSync(0, "utf8").split("\n");
2
3const NOMBRES = {
4  black: "#000000", white: "#ffffff", red: "#ff0000", green: "#008000", blue: "#0000ff", gray: "#808080",
5  silver: "#c0c0c0", navy: "#000080", maroon: "#800000", purple: "#800080", orange: "#ffa500", yellow: "#ffff00",
6};
7
8const hex = ([r, g, b]) => "#" + [r, g, b].map((c) => c.toString(16).padStart(2, "0")).join("");
9const coma = (x) => x.toFixed(2).replace(".", ",");
10
11/** "#777", "#1a2b3c", "rgb(10, 20, 30)" o un nombre → [r, g, b], o null si no es válido. */
12function leerColor(texto) {
13  const t = texto.trim().toLowerCase();
14  if (NOMBRES[t]) return leerColor(NOMBRES[t]);
15  let m = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/.exec(t);
16  if (m) return m.slice(1).map((c) => parseInt(c + c, 16));
17  m = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/.exec(t);
18  if (m) return m.slice(1).map((c) => parseInt(c, 16));
19  m = /^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/.exec(t);
20  if (m && m.slice(1).every((c) => Number(c) <= 255)) return m.slice(1).map(Number);
21  return null;
22}
23
24/** Luminancia relativa de WCAG: cada canal se linealiza (se quita la corrección gamma) y se pondera. */
25function luminancia([r, g, b]) {
26  const lin = (c) => {
27    const s = c / 255;
28    return s <= 0.04045 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
29  };
30  return 0.2126 * lin(r) + 0.7152 * lin(g) + 0.0722 * lin(b);
31}
32
33function contraste(a, b) {
34  const la = luminancia(a), lb = luminancia(b);
35  return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
36}
37
38/** Oscurece (k < 0) o aclara (k > 0) un color un k % hacia el negro o el blanco. */
39function ajustar([r, g, b], k) {
40  return [r, g, b].map((c) => Math.round(k < 0 ? c * (1 + k / 100) : c + ((255 - c) * k) / 100));
41}
42
43/** El color de texto más parecido que llega al mínimo: primero en la dirección que aleja del fondo. */
44function sugerir(texto, fondo, minimo) {
45  const signo = luminancia(texto) <= luminancia(fondo) ? -1 : 1;
46  for (const s of [signo, -signo]) {
47    for (let k = 1; k <= 100; k++) {
48      const c = ajustar(texto, s * k);
49      if (contraste(c, fondo) >= minimo) return c;
50    }
51  }
52  return null;
53}
54
55function main() {
56  let total = 0, aa = 0;
57  lineas.forEach((bruta, i) => {
58    const linea = bruta.trim();
59    if (!linea) return;
60    const partes = linea.split(";").map((p) => p.trim());
61    const [t, f, tam = "16px", peso = ""] = partes;
62    const texto = leerColor(t ?? ""), fondo = leerColor(f ?? "");
63    if (partes.length < 2 || partes.length > 4 || !texto || !fondo) {
64      const malo = partes.length < 2 ? linea : !texto ? t : f;
65      console.log(`Línea ${i + 1}: color no válido «${malo}»`);
66      return;
67    }
68    const m = /^(\d+(?:\.\d+)?)(px|pt)$/.exec(tam);
69    if (!m || (peso && peso !== "negrita")) {
70      console.log(`Línea ${i + 1}: tamaño no válido «${!m ? tam : peso}»`);
71      return;
72    }
73    const px = m[2] === "pt" ? (Number(m[1]) * 4) / 3 : Number(m[1]);
74    const negrita = peso === "negrita";
75    // texto grande: 18 pt (24 px) o 14 pt (18,66 px) en negrita
76    const grande = px >= 24 || (negrita && px >= 18.66);
77    const [minAA, minAAA] = grande ? [3, 4.5] : [4.5, 7];
78    const r = contraste(texto, fondo);
79    total++;
80    let salida = `${hex(texto)} sobre ${hex(fondo)} (${tam}${negrita ? " negrita" : ""}, texto ${grande ? "grande" : "normal"}): ${coma(r)}:1 · AA ${r >= minAA ? "sí" : "no"} · AAA ${r >= minAAA ? "sí" : "no"}`;
81    if (r >= minAA) aa++;
82    else {
83      const s = sugerir(texto, fondo, minAA);
84      salida += s ? ` · prueba ${hex(s)} (${coma(contraste(s, fondo))}:1)` : " · sin sugerencia";
85    }
86    console.log(salida);
87  });
88  console.log(`Combinaciones: ${total}; cumplen AA: ${aa}`);
89}
90
91main();