Detector Docs

Español

English

Español

English

Appearance

Limitaciones del Detector con Degradados y Fondos Complejos ​

El análisis de contraste basado en imagen presenta limitaciones cuando el color final percibido es el resultado de múltiples capas, transformaciones o posiciones dinámicas. A continuación se detallan los casos conocidos donde el detector no puede garantizar precisión total.

1. Fondos con imágenes absolutas o con comportamiento fixed ​

Descripción ​

Cuando un elemento utiliza una imagen de fondo posicionada de forma absoluta (background-position) o con comportamiento fijo (background-attachment: fixed), la porción específica de la imagen que queda detrás del texto no es determinable de forma estable. Esto provoca que el detector no pueda asociar correctamente el área del texto con el fragmento exacto del fondo, generando colores aproximados o inconsistentes.

Ejemplos ​

Referencias técnicas ​

2. Uso de color combinado con background-image (degradado o imagen) ​

Descripción ​

Cuando el fondo de un elemento es un degradado o una imagen que varía significativamente en color, el texto puede quedar sobre múltiples tonos dentro de una misma área. Esto hace que no exista un solo valor representativo del fondo para calcular el contraste y provoca falsos positivos o variación entre mediciones.

Ejemplo ​

Referencia técnica ​

3. Uso de imágenes como “background para dar color” (overlays, blends y filtros) ​

Descripción ​

Muchos sitios aplican imágenes combinadas con capas semitransparentes, overlays, background-blend-mode, filtros o estructuras similares para “tintar” el fondo. En estos casos, el color final es el producto de varias capas superpuestas. El detector, al no tener acceso directo al pipeline gráfico final del navegador, no puede reconstruir fielmente el color resultante.

Ejemplos ​

Referencias técnicas ​

4. Gradiente usado como foreground (texto con degradado) ​

Descripción ​

Algunos sitios aplican degradados como color del texto (foreground), por ejemplo usando:

  • background-clip: text
  • -webkit-text-fill-color: transparent

En estos casos el color del texto no es un valor único, sino la combinación de múltiples tonos a lo largo de un gradiente. Esto impide determinar de forma consistente un único color de foreground para contrastar.

Ejemplo ​

Referencia técnica ​

Conclusión ​

Estas limitaciones son inherentes a la naturaleza dinámica y visualmente compleja de los degradados y composiciones gráficas modernas. En estos casos:

  • El detector puede entregar valores aproximados, no definitivos.
  • Los resultados deben considerarse como indicativos, requiriendo validación manual.
  • Se recomienda documentar el comportamiento esperado para evitar falsos positivos y mejorar la experiencia del QA.