# Elementer skal ha tilstrekkelig fargekontrast

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

WCAG 1.4.3 Contrast (Minimum) · Nivå AA

Noe tekst skiller seg ikke nok fra bakgrunnen til at svaksynte kan lese den.

## Hva denne regelen sjekker
Sørg for at kontrasten mellom forgrunns- og bakgrunnsfarger oppfyller minimumsgrensene for kontrastforhold i WCAG 2 AA.

## Hvorfor det er viktig
WCAG 1.4.3 krever et kontrastforhold på minst 4.5:1 for normal tekst og 3:1 for stor tekst. Svake priser, merker og bannere er vanskelige å lese for svaksynte, og for alle i sterkt lys.

## Slik fikser du det
### På alle nettsteder
1. Finn teksten med lav kontrast, og noter tekstfargen og bakgrunnsfargen: en kontrastsjekker eller utviklerverktøyene i nettleseren viser begge.
2. Endre tekst- eller bakgrunnsfargen i CSS-en til temaet ditt til forholdet er minst 4.5:1 (3:1 for tekst på 24px og større, eller 18,66px med fet skrift).
3. Vær spesielt oppmerksom på salgsmerker, plassholdertekst, lenker i bunnteksten og knapper oppå bilder.

### I Shopify
1. Finn teksten med lav kontrast, og noter tekstfargen og bakgrunnsfargen: en kontrastsjekker eller utviklerverktøyene i nettleseren viser begge.
2. I Nettbutikk > Temaer > Tilpass > Temainnstillinger > Farger gjør du tekstfargen mørkere eller bakgrunnen lysere for det berørte fargeskjemaet, til forholdet er minst 4.5:1.
3. Vær spesielt oppmerksom på salgsmerker, plassholdertekst, lenker i bunnteksten og knapper oppå bilder.

### I WooCommerce og WordPress
1. Finn teksten med lav kontrast, og noter tekstfargen og bakgrunnsfargen: en kontrastsjekker eller utviklerverktøyene i nettleseren viser begge.
2. Endre tekst- eller bakgrunnsfargen i CSS-en til temaet ditt til forholdet er minst 4.5:1 (3:1 for tekst på 24px og større, eller 18,66px med fet skrift).
3. Vær spesielt oppmerksom på salgsmerker, plassholdertekst, lenker i bunnteksten og knapper oppå bilder.

## Slik kontrollerer du utbedringen
- Kjør skanningen på nytt, og bekreft at color-contrast ikke lenger vises.
- Ta en stikkprøve med en kontrastsjekker på de nøyaktige fargene.

## Kilder
- Dokumentasjon av axe-core-regelen (Deque): https://dequeuniversity.com/rules/axe/4.13/color-contrast
- Forklaring av WCAG 1.4.3 (W3C, Understanding): https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum