# Los elementos deben tener un contraste de colores suficiente

<https://www.fixreports.com/es-419/issues/color-contrast>

WCAG 1.4.3 Contraste (mínimo) · Nivel AA

Parte del texto no se distingue lo suficiente de su fondo para que lo lean las personas con baja visión.

## Qué revisa esta regla
Garantiza que el contraste entre colores de primer plano y fondo cumple los límites de la ratio para contraste WCAG 2 AA.

## Por qué es importante
WCAG 1.4.3 exige una relación de contraste de al menos 4.5:1 para el texto normal y de 3:1 para el texto grande. Los precios, las etiquetas y los banners poco visibles son difíciles de leer para las personas con baja visión, y para cualquiera bajo una luz intensa.

## Cómo corregirlo
### En cualquier sitio web
1. Encuentra el texto con poco contraste y anota sus colores de texto y de fondo: un verificador de contraste o las herramientas para desarrolladores de tu navegador muestran ambos.
2. Cambia el color del texto o del fondo en el CSS de tu tema hasta que la relación sea de al menos 4.5:1 (3:1 para texto de 24px o más, o de 18.66px en negrita).
3. Presta especial atención a las etiquetas de oferta, al texto de marcador de posición (placeholder), a los enlaces del pie de página y a los botones sobre imágenes.

### En Shopify
1. Encuentra el texto con poco contraste y anota sus colores de texto y de fondo: un verificador de contraste o las herramientas para desarrolladores de tu navegador muestran ambos.
2. En Tienda online > Temas > Personalizar > Configuración del tema > Colores, oscurece el color del texto o aclara el fondo del esquema de colores afectado hasta que la relación sea de al menos 4.5:1.
3. Presta especial atención a las etiquetas de oferta, al texto de marcador de posición (placeholder), a los enlaces del pie de página y a los botones sobre imágenes.

### En WooCommerce y WordPress
1. Encuentra el texto con poco contraste y anota sus colores de texto y de fondo: un verificador de contraste o las herramientas para desarrolladores de tu navegador muestran ambos.
2. Cambia el color del texto o del fondo en el CSS de tu tema hasta que la relación sea de al menos 4.5:1 (3:1 para texto de 24px o más, o de 18.66px en negrita).
3. Presta especial atención a las etiquetas de oferta, al texto de marcador de posición (placeholder), a los enlaces del pie de página y a los botones sobre imágenes.

## Cómo comprobar la corrección
- Vuelve a ejecutar el análisis y confirma que color-contrast ya no aparece.
- Haz una comprobación puntual con un verificador de contraste usando los colores exactos.

## Fuentes
- Documentación de la regla de axe-core (Deque): https://dequeuniversity.com/rules/axe/4.13/color-contrast
- Comprender WCAG 1.4.3 (W3C): https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum