Färgkontrastkontroll
Kontrollera färgkontrastförhållanden för webbtillgänglighet. Testa kombinationer av text- och bakgrundsfärger mot WCAG-riktlinjerna med förhandsgranskning i realtid, tillgänglighetsbetyg och förbättringsförslag.
Kontrollera färgkontrastförhållanden för webbtillgänglighet. Testa kombinationer av text- och bakgrundsfärger mot WCAG-riktlinjerna med förhandsgranskning i realtid, tillgänglighetsbetyg och förbättringsförslag.
Välj textfärg
Klicka på den första färgväljaren för att välja din textfärg, eller ange en hexkod direkt.
Välj bakgrundsfärg
Använd den andra färgväljaren för att välja din bakgrundsfärg för kontrasttestet.
Granska kontrastresultat
Kontrollera det beräknade kontrastförhållandet och se AA/AAA-betyg för normal och stor text.
Förhandsgranska din design
Visa liveförhandsgranskningen för att se hur din färgkombination ser ut med faktiskt textinnehåll.
Kontrasttestning i realtid
Beräkna kontrastförhållanden omedelbart när du väljer olika kombinationer av text- och bakgrundsfärger.
WCAG-kompatibilitetsbetyg
Få AA- och AAA-betyg för både normal och stor text enligt riktlinjerna för tillgängligt webbinnehåll (WCAG).
Panel för liveförhandsgranskning
Se exakt hur dina färgkombinationer kommer att se ut med exempeltext i både normal och stor storlek.
Visuell poängindikator
Se din kontrastprestanda med ett intuitivt cirkeldiagram som visar poäng från 0-100.
Interaktiva färgväljare
Välj enkelt färger med inbyggda färgväljningsverktyg för både text- och bakgrundsfärger.
Tillgänglighetstips
Få praktiska förslag för att förbättra kontrasten och uppfylla tillgänglighetsstandarder.
En färgkontrastkontroll är ett verktyg som mäter skillnaden i luminans mellan text- och bakgrundsfärger. Den beräknar kontrastförhållanden enligt WCAG-standarder (Riktlinjer för tillgängligt webbinnehåll) för att säkerställa att innehållet är läsbart för användare med synnedsättningar, inklusive färgblindhet och nedsatt syn.
WCAG-kompatibilitet
Säkerställ att dina designer uppfyller internationella tillgänglighetsstandarder med korrekta AA- och AAA-betyg.
Feedback i realtid
Se omedelbara resultat när du justerar färger, vilket gör det enkelt att hitta kompatibla kombinationer.
Visuellt poängsystem
Förstå kontrastprestanda med en blick med vårt intuitiva poängsystem från 0-100.
Ingen installation krävs
Testa färgkombinationer omedelbart i din webbläsare utan att ladda ner någon programvara.
För normal text, sikta på minst 4.5:1 för AA-kompatibilitet eller 7:1 för AAA. Stor text (18pt eller 14pt fet) kräver 3:1 för AA eller 4.5:1 för AAA-kompatibilitet.
AA är standardnivån för tillgänglighetskompatibilitet som krävs av de flesta regleringar. AAA är den högsta nivån, vilket ger förbättrad tillgänglighet för användare med allvarligare synnedsättningar.
Kontrastförhållandet beräknas med hjälp av färgernas relativa luminans enligt WCAG-riktlinjerna. Det sträcker sig från 1:1 (ingen kontrast) till 21:1 (maximal kontrast).
Stor text definieras som 18 punkter (24px) eller större, eller 14 punkter (18.66px) eller större om den är fet. Stor text har mer överseende kontrastkrav.
God färgkontrast säkerställer att innehållet är läsbart för alla, inklusive användare med synnedsättningar, färgblindhet, eller de som visar innehåll i starkt solljus eller på dåliga skärmar.
Verktyget accepterar hex-färgkoder. Du kan konvertera från andra format (RGB, HSL, etc.) till hex med hjälp av onlinekonverterare eller designverktyg.
Generera fantastiska färgpallatter online med vår gratis färgpallattsgenerator. Skapa harmoniska färgscheman med hjälp av färgteoriprinciper eller extrahera färger från bilder. Exportera till formaten CSS, SCSS, Tailwind, JSON, PDF och PNG.