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.

2.19 oant 1
Kontrast
Net slagge
Tekstresultaat
Hiel min

Fergelike: #F39C12 op #FFFFFF

Tekst

16px, Regular (400)

Telt as normale tekst.

  • AA (WCAG 1.4.3): minimaal 4.5:1

    2.31 mear nedich

    Net slagge

  • AAA (WCAG 1.4.6): minimaal 7:1

    4.81 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

    0.81 mear nedich

    Net slagge
2.19 nei 1. Tekst: slagget net foar AA, slagget net foar AAA. UI-ûnderdielen: slagget net.
Hoe dit kontrolearre wurdt
Fergelike kleuren (nei mingjen)
Tekst #F39C12 op eftergrûn #FFFFFF
Relatyf luminânsje
Tekst 0.4287, eftergrûn 1.0000
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
2.1931 nei 1, werjûn as 2.19 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.

Flugge reparaasjes

Aa
Foarbyldtitel

De flugge brune foks springt oer de lui hûn

Lyts tekst foarbyld (12px)

Tekst
#f39c12
Eftergrûn
#ffffff

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.