Kontrastkontroll
Välj text- och bakgrundsfärger för att kontrollera deras kontrastförhållande mot WCAG AA- och AAA-gränserna. Se separata resultat för normal och stor text, tillsammans med en förhandsvisning som använder de valda färgerna.
Det här kan du göra
Kontrollera värdet för två färger
Välj text- och bakgrundsfärg och se kontrastvärdet med två decimaler.
Jämför AA- och AAA-gränserna
Se separata resultat för normal text och stor text med en förhandsvisning som använder de valda färgerna.
Jämför mot svart och vitt
Öppna de valfria detaljerna för att jämföra textfärgen mot svarta och vita bakgrunder.
Så använder du verktyget
Ange textfärgen
Välj HEX, RGB, HSL, HSV eller CMYK och ange textfärgen. Att välja en färgruta växlar indatan till HEX.
Välj bakgrunden
Ange ett tre- eller sexsiffrigt HEX-värde eller använd färgväljaren. #-prefixet är valfritt.
Kontrollera kontrasten
Välj Kontrollera kontrast för att granska värdet, textförhandsvisningen och AA/AAA-resultaten. Kontrollera igen efter att du ändrat någon av färgerna.
När det här hjälper
Kontrollera brödtext på en bakgrund
Ange de färger som används på en sida och kontrollera om normal text når det krävda värdet.
Jämför färger på rubriker
Använd resultatet och förhandsvisningen för stor text när du överväger ett färgpar till en rubrik.
Läsa resultaten
AA- och AAA-värden
AA kräver minst 4,5:1 för normal text och 3:1 för stor text. AAA kräver 7:1 för normal text och 4,5:1 för stor text. Resultaten använder det orundade värdet.
Vad som räknas som stor text
Stor text är minst 18 pt, eller 14 pt fet. I CSS motsvarar det 24px, eller ungefär 18,7px fet. Förhandsvisningen använder text med normal vikt vid 16px och 24px.
Kontrollens omfattning
Det här kontrollerar textkontrasten mellan två ogenomskinliga sRGB-färger. Det bedömer inte bildbakgrunder, alfa blandning, element som inte är text eller helsidans efterlevnad.
Frågor och svar
Betyder ett godkänt värde att hela sidan uppfyller kraven?
Det här resultatet täcker textkontrasten för de två valda färgerna endast. Bedöm helsidans efterlevnad separat.
Vad visar jämförelsen med svart och vitt?
Den jämför den valda textfärgen mot svart och vitt och visar vilket som har högst värde. Det är separat från resultatet för den valda bakgrunden.
Kan jag kontrollera genomskinlig text eller text ovanpå en bild?
Alfa och bildbakgröder stöds inte. Ange ogenomskinliga färger för text och bakgrund.
Indata och utdata
- Textfärg
- HEX-, RGB-, HSL-, HSV- eller CMYK-värden, eller färgväljaren. CMYK är en uppskattning utan ICC-profil.
- Bakgrund
- Tre- eller sexsiffrig HEX, eller färgväljaren. Alfa stöds inte.
- Resultat
- Kontrastvärde, AA/AAA-resultat för normal och stor text samt en textförhandsvisning. Resultaten visas utan någon sparafunktion.