Kontrast Kontrolü
Metin ve arka plan renklerinizin WCAG erisilebilirlik standartlarini karsilayip karsilamadigini kontrol edin. Kontrast oranini hesaplayip AA ve AAA duzeylerini gosterir.
Öne çıkan özellikler
- Gerçek zamanlı kontrast oranı hesaplama
- WCAG 2.1 AA ve AAA uyum kontrolü
- Normal ve büyük metin standartları desteği
- Renk değiştirme ve canlı önizleme
Guide
Renk kontrastı erişilebilirliği, web sitenizdeki metnin görsel engelli kişiler dahil herkes tarafından okunabilir olup olmadığını belirler. Web İçeriği Erişilebilirlik Yönergeleri (WCAG), metnin erişilebilir kabul edilmesi için karşılaması gereken belirli kontrast oranlarını tanımlar. Bu standartları karşılamamak, bazı ziyaretçilerin içeriğinizi okuyamayacağı anlamına gelir ve pek çok yargı bölgesinde, sitenizin yasal erişilebilirlik gereksinimlerine uymadığı anlamına gelir. Bu kılavuz, kontrast oranlarının nasıl çalıştığını, WCAG'nin ne gerektirdiğini ve tasarımınızdan ödün vermeden kontrast sorunlarının nasıl düzeltileceğini açıklamaktadır. Kontrast oranı, 1:1'den (kontrast yok, her iki renk özdeş) 21:1'e (maksimum kontrast, saf beyaz üzerinde saf siyah) kadar bir ölçekte iki rengin göreceli parlaklığını (luminance) karşılaştırır. Göreceli parlaklık, insan gözünün farklı dalga boylarını nasıl algıladığını hesaba katan bir formül kullanılarak rengin RGB değerlerinden hesaplanan, bir rengin insana ne kadar parlak göründüğünün bir ölçüsüdür. Kırmızı, yeşil ve mavi, algılanan parlaklığa farklı katkılarda bulunur; yeşil en fazla, mavi ise en az katkı yapar. Formül şudur: L = 0.2126 * R + 0.7152 * G + 0.0722 * B; burada R, G ve B sRGB değerlerinden doğrusallaştırılır. Doğrusallaştırma adımı, bir transfer fonksiyonu uygulayarak gamma kodlu sRGB değerlerini doğrusal ışık değerlerine dönüştürür. Kontrast oranının kendisi (L1 + 0.05) / (L2 + 0.05) olarak hesaplanır; burada L1 daha açık rengin göreceli parlaklığı ve L2 daha koyu rengin göreceli parlaklığıdır. 0.05 değeri ortam ışığını hesaba katar. Bu formül tanıdık oran formatını üretir. Örneğin, saf beyazın parlaklığı 1.0 ve saf siyahın parlaklığı 0.0'dır ve bu da (1.0 + 0.05) / (0.0 + 0.05) = 21:1 kontrast oranını verir. WCAG, kontrast için iki uyum seviyesi tanımlar. AA seviyesi çoğu web sitesi için temel gereksinimdir. AAA seviyesi, daha iyi okunaklılık sağlayan daha sıkı bir standarttır. Normal boyutlu metin (18pt altında veya 14pt bold altında) için AA seviyesi en az 4.5:1 kontrast oranı gerektirir ve AAA seviyesi 7:1 gerektirir. Büyük metin (18pt ve üzeri, veya 14pt bold ve üzeri) için AA seviyesi 3:1 gerektirir ve AAA seviyesi 4.5:1 gerektirir. Bu eşikler, yaşlı yetişkinler için tipik görme kaybı eşiği olan yaklaşık 20/40 keskinliğine sahip, orta derecede düşük görme yeteneğine sahip kişiler için okunaklılık araştırmalarına dayanmaktadır. Büyük metin istisnası, daha büyük harflerin doğal olarak daha kolay okunabilir olmasından kaynaklanır. Daha büyük boyutlarda, daha kalın vuruşlar ve daha geniş sayaçlar karakterleri daha düşük kontrasta rağmen daha ayırt edilebilir hale getirir. Bu nedenle başlıklar, hero metni ve diğer büyük display metinleri AA uyumu altında 3:1 oranı kullanabilirken gövde metni 4.5:1 gerektirir. CSS terimleriyle, 18pt varsayılan tarayıcı ayarlarında 24px'e eşittir ve 14pt bold yaklaşık 18.66px bold'a eşittir. Metninizin büyük olarak nitelendirilip nitelendirilmediğinden emin değilseniz, güvenli olmak için daha sıkı olan 4.5:1 oranını uygulayın. Metin olmayan öğelerin de WCAG 2.1 Başarı Kriteri 1.4.11 (Metin Olmayan Kontrast) altında kontrast gereksinimleri vardır. İçeriğin anlaşılması için gerekli olan kullanıcı arayüzü bileşenleri (düğmeler, form girişleri, odak göstergeleri) ve grafik nesneler (simgeler, grafik öğeleri), bitişik renklere karşı en az 3:1 kontrast oranına sahip olmalıdır. Beyaz arka plan üzerinde 3:1'in altına düşen açık gri bir düğme kenarlığı, özellikle düşük görme yeteneğine sahip kullanıcılar için düğmeyi tıklanabilir bir öğe olarak tanımayı zorlaştırır. Odak göstergeleri özellikle önemlidir: klavye kullanıcıları gezinmek için görünür odak stillerine güvenir ve bu odak stilleri çevredeki içeriğe karşı 3:1 oranını karşılamalıdır. Renk körlüğü, Kuzey Avrupalı erkeklerin yaklaşık yüzde 8'ini ve kadınların yüzde 0.5'ini, diğer popülasyonlarda değişen oranlarda etkiler. En yaygın formu kırmızı-yeşil renk körlüğüdür (deuteranopia ve protanopia); burada kırmızılar ve yeşiller benzer görünür. Mavi-sarı renk körlüğü (tritanopia) daha az yaygındır. Tam renk körlüğü (achromatopsia) nadirdir. Parlaklığa dayalı kontrast oranı hesaplamaları, parlaklık farkını ölçtüğü için renk algısından bağımsız çalışır (ton farkını değil). Ancak, bilgi aktarmak için yalnızca renge güvenmek (hata için kırmızı, başarı için yeşil), kontrast oranından bağımsız olarak renk körü kullanıcılar için sorunlar yaratır. Renk kodlamasının yanına her zaman simgeler, metin etiketleri veya desenler gibi ek görsel ipuçları sağlayın. Koyu mod (dark mode) ek kontrast değerlendirmeleri getirir. Pek çok tasarımcı koyu temaları renkleri basitçe ters çevirerek oluşturur, ancak bu genellikle kötü sonuçlar üretir. Saf siyah (#000000) arka plan üzerinde saf beyaz (#FFFFFF) metin maksimum kontrast (21:1) yaratır, ancak bu kontrast seviyesi bazı kullanıcılar için görsel yorgunluk ve hale (halation - koyu arka plan üzerinde açık metnin etrafında parıldama etkisi) yaratabilir. #121212 üzerinde #E0E0E0 gibi hafifçe azaltılmış bir kontrast, WCAG AAA gereksinimlerini hala aşarken daha rahattır. Google'ın Material Design koyu tema yönergeleri, yüzey rengi olarak #121212 kullanmayı ve saf beyaz kullanmak yerine metin opaklığını azaltmayı önerir. Birincil metin yüzde 87 opaklık, ikincil metin yüzde 60, devre dışı metin ise yüzde 38 opaklık kullanır. Yarı saydam renkler kontrast kontrolünü karmaşıklaştırır. 1'den küçük alfa değerleriyle rgba() veya hsla() renkleri kullandığınızda, gerçek oluşturulan renk arkasında olan şeye bağlıdır. Koyu arka plan üzerinde yüzde 70 opaklıktaki beyaz metnin etkili kontrastı, açık arka plan üzerindeki aynı metinden farklıdır. Yarı saydam metnin kontrastını kontrol ederken, bileşik rengi (şeffaflığın arka plana uygulandıktan sonra kullanıcının gördüğü gerçek renk) hesaplamanız gerekir. Formül, alfa değerine göre ön plan ile arka planı harmanlar: bileşik = ön plan * alfa + arka plan * (1 - alfa), her kanala uygulanır. Her zaman yalıtılmış şeffaf rengi değil, bileşik sonucu kontrol edin. Gradyan arka planlar metin alanı boyunca değişken kontrast yaratır. Koyu mavi'den açık mavi'ye geçiş yapan bir gradyan üzerinde metin bulunuyorsa, kontrast oranı metnin sol ve sağ kenarlarında farklıdır. WCAG, kontrast oranının metnin göründüğü her noktada karşılanmasını gerektirir. Kontrastı en zayıf noktada, yani arka planın parlaklık olarak metin rengine en yakın olduğu yerde kontrol edin. Gradyan #003366'dan #6699CC'ye kadar değişiyorsa ve metniniz beyazsa, kontrastı en düşük olacağı yer olduğundan #6699CC'ye karşı kontrol edin. Radyal gradyanlar için metin alanı boyunca birden çok noktayı kontrol edin. Görüntü arka planları en zor kontrast meydan okumasını sunar. Fotoğraflar veya desenli arka planlar üzerindeki metin her pikselde farklı kontrasta sahip olacaktır. Çözümler şunlardır: görüntü ile metin arasına düz veya yarı saydam bir katman yerleştirmek, okunaklılığı sağlamak için metin gölgesi veya dış çizgi kullanmak veya metni görüntü içinde tutarlı renge sahip alanlarla sınırlamak. Yaygın bir model, metnin göründüğü bir hero görüntüsünün altındaki koyu gradyan katmanıdır. Gradyan, görüntüyü beyaz metinle yeterli kontrast yaratacak kadar koyulaştırır. Katmanlar için rgba(0, 0, 0, 0.5) çoğu görüntüyü beyaz metinle WCAG AA uyumuna getirir, ancak kendi görüntülerinizle doğrulayın. Renk uzayları ve kontrast hesaplamaları, çoğu aracın kabul ettiğinden daha karmaşıktır. Standart WCAG kontrast formülü, sRGB renk uzayında göreceli parlaklık kullanır. Bu formülün bilinen sınırlamaları vardır. Çok koyu renk çiftlerinin kontrastını aşırı tahmin edebilir ve açık renk çiftlerinin kontrastını düşük tahmin edebilir. Araştırmalar, koyu mavi metnin (#00007E) siyah arka plan üzerinde teknik olarak WCAG AA'yı geçtiğini ancak pratikte okunmasının son derece zor olduğunu göstermiştir. APCA (Advanced Perceptual Contrast Algorithm), WCAG 3.0 için geliştirilen ve kutuplık etkini dahil olmak üzere insan görsel algısını daha doğru hesaba katlayan daha yeni bir yaklaşımdır (koyu arka plan üzerinde açık metin, açık arka plan üzerinde koyu metinden farklı algılanır). WCAG 2.x ve sRGB tabanlı formülü mevcut yasal standart olmaya devam etse de, APCA daha algısal olarak doğru bir değerlendirme sağlar. APCA modeli, font boyutu ve ağırlığına göre farklı kontrast gereksinimleri atayarak WCAG 2.x'in ikili eşik yaklaşımı yerine minimum kontrast değerlerinden oluşan bir matris yaratır. Örneğin, 14px normal ağırlık metin, 24px bold metinden daha yüksek bir APCA kontrast değerine ihtiyaç duyar. APCA ayrıca kutupluk sorununu ele alır: koyu arka plan üzerinde açık metin, açık arka plan üzerinde koyu metinden farklı kontrast değerleri gerektirir. APCA henüz resmi standart olmasa da, anlaşılması özellikle WCAG 2.x'in sorgulanabilir sonuçlar ürettiği sınır durumlarda daha iyi kontrast kararları vermenize yardımcı olur. Kontrast başarısızlıklarını düzeltmek genellikle üç yaklaşımdan birini içerir: metni koyulaştırmak, arka planı açmak veya her ikisi. Renkleri ayarlarken, ton (hue) veya doygunluğu (saturation) değiştirmek yerine HSL renk uzayındaki parlaklık (lightness) değerini değiştirerek marka paletiniz içinde kalın. Marka maviniz hsl(210, 80%, 55%) ise ve beyaza karşı kontrastta başarısız oluyorsa, parlaklığı hsl(210, 80%, 40%) değerine düşürmek hala tanınabilir şekilde marka maviniz olarak kalırken geçebilir. Küçük parlaklık ayarlamaları genellikle tam bir yeniden tasarıma gerek kalmadan kontrast sorunlarını çözer. OKLCH renk uzayında bu ayarlamalar daha da algısal olarak tekdüze sonuçlar üretir. CSS özel özellikleri, kontrast duyarlı temalandırmayı pratik hale getirir. Renklerinizi özel özelliklerde HSL değerleri olarak tanımlayın, ardından kontrast gereksinimlerini karşılayan açık ve koyu tema varyantları oluşturun. Örneğin: açık tema için --brand-primary: hsl(210, 80%, 40%) ve koyu tema için --brand-primary: hsl(210, 80%, 70%). Her ikisi aynı ton ve doygunluğu kullanır ancak kendi arka planları için optimize edilmiş farklı parlaklık değerleri. Bu yaklaşım düzinelerce renk belirtecine sahip tüm tasarım sistemlerine ölçeklenir. Her temada erişilebilirlik gereksinimlerini karşılayan marka tutarlılığını korursunuz. Tasarım sistemi entegrasyonu, kontrast kontrolünün en değerli olduğu yerdir. Bireysel sayfa öğelerini kontrol etmek yerine, renk belirteçlerinizi tanımlayın ve belirteç sisteminizdeki her metin-arıza-arka plan kombinasyonunun WCAG gereksinimlerini karşıladığını doğrulayın. Hangi metin renklerinin hangi arka plan renklerinde güvenli olduğunu gösteren bir kontrast matrisinde onaylanmış kombinasyonları belgeleyin. Ardından geliştiriciler bileşenler oluşturduğunda, önceden onaylanmış renk çiftlerinden seçerler ve kontrast uyumu örnek başına kontrol edilmek yerine sistem tarafından garanti edilir. Google, Microsoft ve Adobe gibi büyük kuruluşların kontrastı ölçekte bu şekilde ele alması budur. Kontrast matrisi oluşturmak, tüm arka plan renklerinizi en üste ve tüm metin renklerinizi yan tarafa listelemeyi, ardından her kesişim için kontrast oranını hesaplamayı içerir. Her hücreyi AA geçer, AAA geçer veya başarısız olarak işaretleyin. Bu matris tüm ekibiniz için bir referans belgesi haline gelir. Bir tasarımcı bir renk kombinasyonu belirttiğinde, matrisi anında kontrol edebilir. Bir geliştirici bir bileşeni uyguladığında, matris hangi renk belirteçlerinin birlikte güvenli olduğunu söyler. Otomatik test, kontrast sorunlarını erken yakalar. axe-core, Lighthouse ve Pa11y gibi araçlar oluşturulan sayfaları tarar ve WCAG kontrast gereksinimlerini karşılamayan öğeleri işaretler. Kontrast gerilemelerinin dağıtımdan önce yakalanması için bunları CI/CD boru hattınıza entegre edin. Otomatik araçların sınırlaması, görüntüler, gradyanlar veya dinamik olarak değişen arka planlardaki metni değerştirememeleridir. Bu durumlar için manuel kontrol aracıyla kontrast kontrolü gerekli olmaya devam eder. Kapsamlı bir yaklaşım, çoğu durum için otomatik test ve otomasyonun başa çıkamadığı sınır durumları için manuel kontrol kullanır. Yasal uyumluluk, kontrast erişilebilirliği etrafındaki aciliyetin çoğunu yönlendirir. Amerika Birleşik Devletleri'nde Americans with Disabilities Act (ADA), AB'de European Accessibility Act, Kanada'da Accessibility for Ontarians with Disabilities Act ve diğer yargı bölgelerindeki benzer yasalar ya doğrudan WCAG uyumu gerektirir ya da mahkemeler tarafından gerektirdiği şeklinde yorumlanmıştır. Web erişilebilirliği üzerinden açılan davalar yıldan yıla önemli ölçüde artmıştır ve kontrast başarısızlıkları en sık atıf yapılan sorunlardan biridir. WCAG AA'yı karşılamak yaygın olarak kabul edilen yasal standarttır. Düzenlenen sektörlerdeki (devlet, sağlık, eğitim, finans) kuruluşlar daha sıkı gereksinimlerle ve daha aktif yaptırımlarla karşı karşıyadır. Yasal uyumluluğun ötesinde, iyi kontrast iyi tasarımdır. Okunması kolay metin daha iyi dönüştürür, ziyaretçileri daha uzun süre tutar ve hemen çıkma oranlarını azaltır. Parlak güneş ışığında telefonlarda okuma yapan kullanıcılar, doğal olarak azalan görme yeteneğine sahip yaşlı kullanıcılar, zayıf renk üretimine sahip düşük kaliteli monitörlerdeki kullanıcılar ve yalnızca yorgun olan kullanıcıların tümü güçlü kontrasttan yararlanır. İnsan yeteneğinin sınırları için tasarım yapmak (düşük görme, zorlu ortamlar), merkezdeki herkes için de daha iyi çalışan tasarımlar üretir. Araştırmalar, daha yüksek kontrastlı metnin okuma süresini azalttığını ve yalnızca görsel engeli olanlar değil, tüm kullanıcılar arasında kavrayışı iyileştirdiğini göstermiştir. Kontrast seçimlerinizi gerçek koşullarda test etmek, birden çok cihazda, çeşitli aydınlatma koşullarında ve yer tutucu metin yerine gerçek içerikle kontrol etmek anlamına gelir. Matematiksel kontrast kontrolünden geçen bir renk çifti, font ince, metin küçük veya harf aralığı sıkıysa hala okunması zor olabilir. Kontrast oranı gerekli bir minimumdur, okunaklılık garantisi değildir. En iyi sonuçlar için yeterli kontrastı uygun font boyutu (gövde metni için minimum 16px), ağırlık (regular veya medium, light veya thin değil) ve aralık (1.5 veya üzeri satır yüksekliği) ile eşleştirin. Yaygın kontrast tuzakları arasında form girişlerindeki yer tutucu metin (genellikle beyaz üzerinde açık gri, kontrast gereksinimlerinde başarısız), devre dışı düğme metni (tam kontrast gereksinimlerini karşılamasa bile hala ayırt edilebilir olması gerekir), yalnızca renge dayanarak çevredeki metinden ayırt edilen bağlantı metni (çevredeki metne karşı bağlantı kontrastı en az 3:1 olmadıkça WCAG alt çizgi gibi ek bir görsel gösterge gerektirir) ve kontrastın konuma göre değiştiği dekoratif arka planlar üzerindeki metin bulunur. Marka rengi erişilebilirliği sık karşılaşılan bir zorluktur. Pazarlama ekipleri marka renklerini WCAG uyumu için değil, duygusal etki ve görsel çekicilik için seçer. Parlak bir turuncu marka renginin (hsl(30, 100%, 50%)) beyaza karşı kontrast oranı yalnızca 2.14:1'dir; bu, normal metin için 4.5:1 AA gereksiniminin çok altındadır. Çözüm, marka renklerinin erişilebilir varyantlarını oluşturmaktır. Tonu koruyun, parlaklığı ayarlayın. hsl(30, 100%, 35%) hala tanınabilir şekilde turuncudur ancak beyaza karşı 4.6:1 ile AA'yı geçer. Büyük metin ve dekoratif öğeler için birincil renkler (daha düşük kontrast kabul edilebilir) ve gövde metni, bağlantılar ve arayüz bileşenleri için ayarlanmış varyantlar (AA'yı geçmeli) ile bir marka renk paleti oluşturun. Veri görselleştirme ve grafikler benzersiz kontrast zorlukları sunar. Bir grafikteki her veri serisinin bitişik serilerden ve arka plandan ayırt edilebilir olması gerekir. Beş veya daha fazla veri serisiyle, hepsinin birbiriyle ve arka planla yeterince kontrast yapan renkler bulması zordur. Renk körü güvenli paletler (ColorBrewer veya Okabe-Ito paletinden gelenler gibi) özel olarak bu amaç için tasarlanmıştır. Renğin ötesinde, veri serilerini ayırt etmek için desenler, dokular veya doğrudan etiketler kullanın. Çizgi grafikler farklı tire desenleri kullanabilir. Çubuk grafikler diyagonal tarlama kullanabilir. Dağılım grafikleri farklı şekiller kullanabilir. Farklı aydınlatma ortamlarında kontrast dramatik şekilde değişir. Loş bir ofiste rahatça okunabilen bir renk çifti, doğrudan güneş ışığında neredeyse görünmez hale gelir. Mobil kullanıcılar sık sık parlak açık hava koşullarıyla karşılaşır. Yüksek kontrast oranları çevresel faktörlere karşı bir tampon sağlar. Tam olarak 4.5:1'de (AA minimumu) olan bir çift kontrollü koşullarda okunabilirdir ancak parlak güneş ışığında başarısız olabilir. 5:1 veya 6:1 hedeflemek, gerçek dünya görüntüleme koşullarını hesaba katan bir pay bırakır. Kritik arayüz öğeleri (gezinme, eylem çağrıları, hata mesajları) için daha yüksek kontrast tarafını tercih edin. Renk yönetimi ve cihaz farklılıkları kullanıcıların kontrastı nasıl algıladığını etkiler. Geniş gamlı bir ekranda (P3 veya Adobe RGB) bir sRGB rengi, amaçlanandan biraz farklı görünebilir. Ucuz TN panel monitörler renkleri IPS veya OLED ekranlardan farklı gösterir. Ekran parlaklığı ayarları algılanan kontrastı değiştirir. Mavi ışık filtreleri ve gece modu ekranı sıcak renklendirir ve serin renklerin algılanan kontrastını azaltır. Bu faktörlerin hiçbiri hesaplanan WCAG oranını değiştirmez, ancak gerçek görsel deneyimi etkiler. Birden çok cihazda ve birden çok koşulda test yapmak, matematiksel hesaplamaların kaçırdığı sorunları yakalar. Görüntülere gömülü metin için kontrast gereksinimleri canlı metinle aynıdır. Hero görüntünüz görüntü dosyasına pişirilmiş metin içeriyorsa (HTML metni değil), bu metnin yine de WCAG kontrast gereksinimlerini karşılaması gerekir. Fark, görüntü metnini CSS ile ayarlayamayacağınızdır, bu nedenle kontrastın dışa aktarmadan önce görüntü düzenleme aracında doğrulanması gerekir. Sosyal medya önizleme görüntüleri (og:image) genellikle okunaklı olması gereken metin içerir, ancak bunlar üçüncü taraf platformlarda göründüğünden WCAG tarafından resmi olarak kapsanmazlar. Tipografide kontrast yalnızca ön plan ve arka plan renklerinin ötesine geçer. Metnin algılanan kontrastı font ağırlığına, font boyutuna, harf aralığına ve satır yüksekliğine bağlıdır. İnce fontlar (300 ağırlık ve altı), daha ince vuruşların arka plandan ayırt edilmesini zorlaştırdığından aynı metnin regular veya bold ağırlığından daha yüksek kontrast oranlarına ihtiyaç duyar. WCAG spesifikasyonu eşiklerinde (yalnızca boyutta) font ağırlığını hesaba katmaz, bu nedenle teknik olarak geçen bir oran, font çok inceyse hala okunamaz metin üretebilir. Gövde metni için minimum olarak regular (400) veya medium (500) ağırlık kullanın. Light ve thin ağırlıkları, boyutun azalan vuruş görünürlüğünü telafi ettiği büyük başlıklar için ayırın. Büyük bir web sitesinde sistematik kontrast denetimi, otomatik araçlar ve manuel inceleme birleşimini gerektirir. Oranları geçemeyen sabit kodlanmış renkleri yakalamak için otomatik taramalar (axe-core, Lighthouse) çalıştırın. Ardından dinamik içeriği, kullanıcı tarafından oluşturulan içerik alanlarını, etkileşimli durumları (hover, focus, active, devre dışı), hata ve başarı mesajlarını, araç ipucu metnini ve rengin çalışma zamanında belirlendiği her alanı manuel olarak inceleyin. Tekrarlayan bir denetim zamanlaması oluşturun: büyük siteler için üç ayda bir, aktif geliştirme sırasında ayda bir. İlerlemeyi ölçmek için zaman içinde kontrast sorunlarının sayısını takip edin. Kontrast kontrol aracı, herhangi iki rengi girmenizi ve anında kontrast oranını, hem normal hem de büyük metin için WCAG AA ve AAA geçer/kalır durumunu ve kombinasyonun görsel bir önizlemesini görmenizi sağlar. Tasarım aşamasında renk seçimlerini geliştirmeye ulaşmadan önce doğrulamak, kod incelemesi sırasında uygulanan renklerin tasarımla eşleştiğini doğrulamak ve erişilebilirlik denetimleri sırasında mevcut sorunları tanımlamak ve düzeltmek için kullanın. Araç hex, RGB ve HSL renk değerlerini kabul eder ve her renk için hesaplanan parlaklığı oranla birlikte gösterir.
Sık sorulan sorular
WCAG AA için hangi kontrast oranı gerekli?
WCAG AA, normal metin için minimum 4.5:1 ve büyük metin (18px+ veya 14px+ kalın) için 3:1 kontrast oranı gerektirir.
AA ile AAA arasındaki fark nedir?
AAA daha katıdır: normal metin için 7:1 ve büyük metin için 4.5:1. AA, önerilen minimum standarttır.
