ImageColorPicker.com

Kleurkontrastkontrôle

Test de kontrastferhâlding tusken foargrûn- en eftergrûnkleur om tagonklikens te garandearjen.

Kontrolearje dyn kleuren

Test kleurkombinaasjes om te soargjen dat se foldogge oan WCAG tagonklikheidsnormen foar tekstlêsberens.

5.72 oant 1
Kontrast
AA
Tekstresultaat
Goed

Fergelike: #FFFFFF op #BB3344

Tekst

16px, Regular (400)

Telt as normale tekst.

  • AA (WCAG 1.4.3): minimaal 4.5:1

    Slagge

  • AAA (WCAG 1.4.6): minimaal 7:1

    1.28 mear nedich

    Net slagge

UI-ûnderdielen en grafiken

Ikoanen, ynfiergrinzen, fokusindikatoaren en oare ûnderdielen dy'tst sjen moatte kinne om de interface te brûken.

  • AA (WCAG 1.4.11): minimaal 3:1

    Slagge
5.72 nei 1. Tekst: slaaget foar AA, slagget net foar AAA. UI-ûnderdielen: slaaget.
Hoe dit kontrolearre wurdt
Fergelike kleuren (nei mingjen)
Tekst #FFFFFF op eftergrûn #BB3344
Relatyf luminânsje
Tekst 1.0000, eftergrûn 0.1334
Formule
(L1 + 0.05) / (L2 + 0.05) wêrby't L1 de luminânsje is fan de ljochtste kleur en L2 fan de donkerste.
Exacte ratio
5.7221 nei 1, werjûn as 5.72 nei 1. De werjûn wearde wurdt ôfknipt, net ôfrûn, dus it liket noait better as it is. De eksakte wearde is wat fergelike wurdt mei de eask.

Tekstgrutte: 16px, Regular (400)

Telt as normale tekst. Grutte tekst is minimaal 24px (18pt), of minimaal 18.67px (14pt) as it fet is (gewicht 700 of mear). Gruttes wurde ôfknipt werjûn, net ôfrûn.

Telt as normale tekst. Grutte tekst is minimaal 24px (18pt), of minimaal 18.67px (14pt) as it fet is (gewicht 700 of mear). Gruttes wurde ôfknipt werjûn, net ôfrûn.

Aa
Foarbyldtitel

De flugge brune foks springt oer de lui hûn

Lyts tekst foarbyld (12px)

Tekst
#ffffff
Eftergrûn
#bb3344

WCAG Standerts

Nivo AA

Minimale kontrastferhâlding fan 4.5:1 foar normale tekst en 3:1 foar grutte tekst. Ferplicht foar measte websiden.

Nivo AAA

Ferbettere kontrastferhâlding fan 7:1 foar normale tekst en 4.5:1 foar grutte tekst. Oanrikkemandearre foar optimale tagonklikens.

Kleurkontrastkontrôler

Bereken it kontrastferhâlding fan tekst- en eftergrûnkleur.

Kies in kleur mei de kleurwizer foar tekst- en eftergrûnkleur of fier in kleur yn RGB hexadezimaal formaat yn (bygelyks #259 of #2596BE). Jo kinne de slider oanpasse om kleur te selektearjen. De Web Content Accessibility Guidelines (WCAG) hat in spesifike rjochtline om út te finen oft tekst lêzber is foar sjende brûkers. Dit kritearium brûkt in spesifyk algoritme om kleurkombinaasjes te fergelykjen yn ferhâldingen. Mei dizze formule stelt WCAG dat in 4.5:1 kleurkontrastferhâlding mei tekst en syn eftergrûn adekwaat is foar normale (lichaamstekst) tekst, en grutte tekst (18+ pt normaal, of 14+ pt fet) moat teminsten in 3:1 kleurkontrastferhâlding hawwe.

Haadfunksjes

  • Real-time kontrastferhâlding berekkening
  • WCAG AA & AAA neilibjen kontrôle
  • HSL-skuorren foar fine-tuning
  • Meardere foarbyldformaten

Avansearre ark

  • Automatysk kleurreparaasje
  • Tekst- en eftergrûnfoarbylden
  • Kleurnamme-deteksje
  • Resultaten eksportearje

Faak stelde fragen

Foar WCAG AA-foldwaning fereasket normale tekst in minimaal kontrastferhâlding fan 4,5:1, wylst grutte tekst (18pt of 14pt fet) 3:1 fereasket.

WCAG AAA fereasket hegere kontrastferhâldingen: 7:1 foar normale tekst en 4,5:1 foar grutte tekst, yn ferliking mei 4,5:1 en 3:1 foar AA, respektyf.

Brûk ús funksje foar automatyske reparaasje om tekst- of eftergrûnkleuren oan te passen mei behâld fan dyn ûntwerpbedoeling, of pas de kleuren mei de hân oan mei HSL-skuvers mei visuele yndikatoren dy't de optimale sônes foar AA/AAA-foldwaning sjen litte.

De griene sônes en AA/AAA-markeringen litte de optimale berikken sjen foar it berikken fan WCAG-foldwaning. De rjochtingstips (Ljochter/Donkerder) liede dy nei better kontrast, basearre op dyn aktuele kleurkombinaasje.

Ja, do kinst elke hexkoade ynfiere of de kleurkiezer brûke om eigen kleuren te selektearjen. De URL wurdt automatysk bywurke, sadat do bepaalde kleurkombinaasjes diele kinst.