Pulsuz WCAG Rəng Kontrast Yoxlayıcısı
İki rəngin əlçatanlıq üçün WCAG AA və AAA kontrast standartlarına cavab verib-vermədiyini yoxlayın. Kontrast çox aşağı olduqda avtomatik təkliflərlə çoxlu mətn ölçülərində canlı önizləmə.
Böyük başlıq mətni
Orta gövdə mətni (18px) — oxu və məzmun üçün.
Normal gövdə mətni (16px) — paraqraflar üçün.
Kiçik gövdə mətni (14px) — başlıqaltlar və metadata üçün.
Kontrast nisbəti
4.5:1 tələb olunur · Sizdə 14,63:1 var
3.0:1 tələb olunur · Sizdə 14,63:1 var
7.0:1 tələb olunur · Sizdə 14,63:1 var
4.5:1 tələb olunur · Sizdə 14,63:1 var
3.0:1 tələb olunur · Sizdə 14,63:1 var
Sürətli hazır dəstlər
WCAG 2.1 kontrast qaydalarına əsaslanır. Böyük mətn = 18pt (24px) normal və ya 14pt (18,66px) qalın. HEX kodları hər iki istiqamətdə yenilənir: HEX yazın və ya rəng seçin, hər iki giriş sinxronlaşır.
Ümumi istifadələr
- WCAG Compliance üçün Veb Səhifələri AuditSaytınızın mətn rəngləri əlçatanlıq üçün WCAG AA və ya AAA ziddiyyət standartlarını qarşılamasını yoxlayın.
- Brend Rəng Kombinasiyalarını DoğrulayınBrend rəng paletiniz əlçatan UI dizaynı üçün işləşir ki, yoxlayın.
- Qaranlıq Rejim Rəng Palitrasını SınaAçıq mətn qaranlıq arxa planında yenə də ziddiyyəti əldən verə biləri - qaranlıq rejim paletinizin cütləşməsini burada yoxlayın.
- Çap Materialları üçün Rəng CütləmələriPlakatlarda, işarələrdə və çap edilmiş materialların da oxuna bilinən ziddiyyət lazımdır - xüsusilə yaşlı tamaşaçılar üçün.
- Əlçatılan Düymə Rənglərini Dizayn EdinCTA, əməliyyat düymələri və linklərin WCAG-ə qarşı arka planlarına uyğun gəldiyinə əmin olun.
Necə İşləyir
Kontrast yoxlanması tamamilə brauzerinizdə WCAG 2.1 nisbi parlaqlıq alqoritmindən istifadə edərək işləyir — kitabxana yoxdur, server yoxdur, yalnız spesifikasiyaya dəqiq uyğun əl ilə yazılmış riyaziyyat. Yazdıqca və ya bir rəng seçdikcə hər nəticə real vaxtda yenilənir.
- 1Hex girişi və normallaşdırmaHəm 3-rəqəmli (#abc) həm də 6-rəqəmli (#aabbcc) hex dəyərləri qəbul edilir və tam RGB üçlüklərinə normallaşdırılır. Etibarsız giriş sükutla qaraya keçmək əvəzinə dərhal rədd edilir, ona görə yanıldıcı bir keçdi nəticəsi əvəzinə qırmızı bir sərhəd görünür.
- 2WCAG parlaqlıq hesablamasıHər rəng WCAG 2.1 düsturundan istifadə edərək nisbi parlaqlığa çevrilir: sRGB kanal dəyərləri parçalı gamma korreksiyası ilə xətti hala gətirilir (0.03928-dən aşağı 12.92-yə bölünür, üstündə 2.4 gücünə yüksəldilir), sonra 0.2126R + 0.7152G + 0.0722B kimi çəkilir.
- 3Kontrast nisbəti və uyğunluq yoxlamalarıKontrast nisbəti (daha açıq + 0.05) / (daha tünd + 0.05) kimi hesablanır və bütün beş WCAG hüddu ilə yoxlanılır: AA normal mətn (4.5:1), AA böyük mətn (3:1), AAA normal mətn (7:1), AAA böyük mətn (4.5:1) və UI komponentləri (3:1). Nəticələr hər klaviatura vuruşunda yenilənir.
- 4Ton-qoruyan düzəliş təklifləriCüt WCAG AA-dan keçmədikdə, alət eyni ton və doyğunluğu saxlayarkən 4.5:1-dən keçən hər rəngin ən yaxın variantını tapmaq üçün orijinal parlaqlıqdan hər iki istiqamətə addımlayaraq HSL parlaqlıq fəzasında axtarır. EyeDropper API (Chromium) də ekranınızdan birbaşa istənilən rəngi nümunə götürmək üçün mövcuddur.
Əlaqəli Alətlər
Rəng Korluğu Simulyatoru
Dizaynınızın rəng görməsi çatışmazlığı olan insanlara necə göründüyünü görün. Protanopiya, deuteranopiya, tritanopiya, axromatopsiya və daha yüngül anomaliyaları simulyasiya edir.
Ekranımın Görüntü İmkanı Nədir
Ekran qətnamənizi CSS və həqiqi piksellərlə, pəncərə ölçüsünü, piksel nisbətini, rəng dərinliyini, HDR, toxunma dəstəyini və yenilənmə sürətini görün və hamısını kopyalayın.
Ölü Piksel Testi
Ekranınızı ölü və ya ilişib qalmış piksellər üçün tam ekran qara, ağ, qırmızı, yaşıl, mavi və boz rənglərlə, üstəlik isteğe bağlı ilişib qalmış piksel düzəldici ilə yoxlayın.