ImageColorPicker.com

Provera kontrasta boja

Testiraj odnos kontrasta između boje prednjeg plana i pozadine kako bi osigurao pristupačnost.

Proveri svoje boje

Testiraj kombinacije boja kako bi osigurao da ispunjavaju WCAG standarde pristupačnosti za čitljivost teksta.

5.73 prema 1
Kontrast
AA
Rezultat za tekst
Dobro

Upoređeno: #000000 na #B6765B

Tekst

16px, Regular (400)

Računa se kao običan tekst.

  • AA (WCAG 1.4.3): najmanje 4.5:1

    Ispunjava

  • AAA (WCAG 1.4.6): najmanje 7:1

    Potrebno još 1.27

    Ne prolazi

UI komponente i grafika

Ikone, ivice input polja, indikatori fokusa i drugi delovi koje moraš da vidiš da bi koristio interfejs.

  • AA (WCAG 1.4.11): najmanje 3:1

    Ispunjava
5.73 prema 1. Tekst: zadovoljava AA, ne zadovoljava AAA. UI komponente: zadovoljava.
Kako se ovo proverava
Boje koje se upoređuju (nakon mešanja)
Tekst #000000 na pozadini #B6765B
Relativna luminancija
Tekst 0.0000, pozadina 0.2365
Formula
(L1 + 0.05) / (L2 + 0.05) gde je L1 luminancija svetlije boje, a L2 luminancija tamnije.
Tačan odnos
5.7314 prema 1, prikazano kao 5.73 prema 1. Prikazana vrednost je skraćena, nije zaokružena, tako da nikad ne izgleda bolje nego što jeste. Tačna vrednost se upoređuje sa zahtevom.

Veličina teksta: 16px, Regular (400)

Računa se kao običan tekst. Veliki tekst je najmanje 24px (18pt), ili najmanje 18.67px (14pt) kada je podebljan (težina 700 ili više). Veličine se prikazuju odsečene, ne zaokružene.

Računa se kao običan tekst. Veliki tekst je najmanje 24px (18pt), ili najmanje 18.67px (14pt) kada je podebljan (težina 700 ili više). Veličine se prikazuju odsečene, ne zaokružene.

Aa
Naslov pregleda

Brza smeđa lisica skače preko lenjog psa

Primer malog teksta (12px)

Tekst
#000000
Pozadina
#b6765b

WCAG standardi

Nivo AA

Minimalni odnos kontrasta od 4.5:1 za običan tekst i 3:1 za veliki tekst. Potrebno za većinu sajtova.

Nivo AAA

Poboljšani odnos kontrasta od 7:1 za običan tekst i 4.5:1 za veliki tekst. Preporučeno za optimalnu pristupačnost.

Provera kontrasta boja

Izračunaj odnos kontrasta između boje teksta i pozadine.

Izaberi boju koristeći biranje boje za tekst i pozadinu ili unesi boju u RGB heksadecimalnom formatu (npr. #259 ili #2596BE). Možeš podesiti klizač za odabir boje. Smernice za pristupačnost Web sadržaja (WCAG) imaju specifične smernice za procenu čitljivosti teksta za korisnike sa vidom. Ovaj kriterijum koristi određeni algoritam za mapiranje kombinacija boja u uporedive odnose. Prema ovoj formuli, WCAG navodi da je 4.5:1 odnos kontrasta boje sa tekstom i pozadinom adekvatan za običan tekst, a veliki tekst (18+ pt obični, ili 14+ pt bold) treba da ima najmanje odnos kontrasta 3:1.

Ključne karakteristike

  • Izračunavanje kontrastnog odnosa u realnom vremenu
  • Provera usklađenosti sa WCAG AA i AAA
  • HSL klizači za fino podešavanje
  • Višestruki formati pregleda

Napredni alati

  • Automatsko ispravljanje boja
  • Uzorci teksta i pozadine
  • Detekcija naziva boje
  • Izvoz rezultata

Često postavljana pitanja

Za WCAG AA usklađenost, običan tekst zahteva minimalni odnos kontrasta 4,5:1, dok veliki tekst (18pt ili 14pt podebljano) zahteva 3:1.

WCAG AAA zahteva veće odnose kontrasta: 7:1 za običan tekst i 4,5:1 za veliki tekst, u poređenju sa 4,5:1 i 3:1 za AA.

Koristi našu funkciju automatske ispravke da prilagodiš boje teksta ili pozadine, a da pritom zadržiš dizajnersku nameru, ili ručno podesi boje pomoću HSL klizača sa vizuelnim oznakama koje pokazuju optimalne zone za AA/AAA usklađenost.

Zelene zone i AA/AAA oznake pokazuju optimalne opsege za postizanje WCAG usklađenosti. Smerne oznake (Svetlije/Tamnije) te vode ka boljem kontrastu na osnovu tvoje trenutne kombinacije boja.

Da, možeš uneti bilo koji heks kod boje ili koristiti birač boja za izbor sopstvenih boja. URL se automatski ažurira pa možeš podeliti određene kombinacije boja.