Om detta verktyg
Kontrollera färgkontrastförhållanden mellan förgrundstext och bakgrundsfärger enligt WCAG 2.1 tillgänglighetsriktlinjer. Ange färger som hexadecimala koder, RGB-värden eller HSL-värden och se omedelbart kontrastförhållandet tillsammans med godkända/underkända resultat för WCAG AA- och AAA-kompatibilitet vid både normala och stora textstorlekar.
Vanliga frågor
- Vilket kontrastförhållande krävs för WCAG-efterlevnad?
- WCAG AA kräver 4,5:1 för normal text och 3:1 för stor text (18pt+ eller 14pt+ fetstil). WCAG AAA kräver 7:1 för normal text och 4,5:1 för stor text. Maximalt möjliga förhållande är 21:1 (svart på vitt).
- Varför spelar färgkontrast roll?
- Tillräcklig kontrast säkerställer att texten är läsbar för användare med nedsatt syn, färgblindhet eller de som tittar på skärmar i starkt solljus. Det är också ett juridiskt krav enligt ADA och EU:s tillgänglighetsbestämmelser för många webbplatser.
- Vad anses vara "stor text" i WCAG?
- Stor text definieras som 18 pkt (24 px) och högre för normal vikt, eller 14 pkt (18,66 px) och över för fet text. Stor text har lägre kontrastkrav eftersom den i sig är lättare att läsa.
- Kontrollerar det här verktyget kontrasten för icke-textelement?
- WCAG 2.1 kräver ett kontrastförhållande på 3:1 för UI-komponenter och grafiska objekt (knappar, ikoner, formulärfält). Du kan använda det här verktyget för att verifiera dem också - skriv bara in komponenten och bakgrundsfärgerna.