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.

18.86 oant 1
Kontrast
AAA
Tekstresultaat
Super

Fergelike: #000000 op #F1F3F4

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

    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
18.86 nei 1. Tekst: slaaget foar AA, slaaget foar AAA. UI-ûnderdielen: slaaget.
Hoe dit kontrolearre wurdt
Fergelike kleuren (nei mingjen)
Tekst #000000 op eftergrûn #F1F3F4
Relatyf luminânsje
Tekst 0.0000, eftergrûn 0.8933
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
18.8667 nei 1, werjûn as 18.86 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
#000000
Eftergrûn
#f1f3f4

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.