रंग कंट्रास्ट चेकर

सुलभता सुनिश्चित करने के लिए अग्रभूमि और पृष्ठभूमि रंगों के बीच कंट्रास्ट अनुपात का परीक्षण करें।

अपने रंग जाँचें

पाठ की पठनीयता के लिए WCAG एक्सेसिबिलिटी मानकों को पूरा करने के लिए रंग संयोजनों का परीक्षण करें।

13.58 अनुपात 1
कंट्रास्ट
AAA
टेक्स्ट परिणाम
सुपर

तुलना की गई: #000000 पर #CDD0D6

टेक्स्ट

16px, सामान्य (400)

सामान्य टेक्स्ट माना जाता है।

  • AA (WCAG 1.4.3): कम से कम 4.5:1

    उत्तीर्ण
  • AAA (WCAG 1.4.6): कम से कम 7:1

    उत्तीर्ण

UI कॉम्पोनेंट और ग्राफिक्स

आइकन, इनपुट बॉर्डर, फोकस संकेतक और इंटरफ़ेस इस्तेमाल करने के लिए जिन हिस्सों को देखना ज़रूरी होता है।

  • AA (WCAG 1.4.11): कम से कम 3:1

    उत्तीर्ण
13.58 अनुपात 1। टेक्स्ट: AA पास होता है, AAA पास होता है। UI घटक: पास होता है।
यह कैसे जाँचा जाता है
तुलना किए गए रंग (ब्लेंड करने के बाद)
टेक्स्ट #000000 पर बैकग्राउंड #CDD0D6
सापेक्ष ल्यूमिनेंस
टेक्स्ट 0.0000, बैकग्राउंड 0.6294
सूत्र
(L1 + 0.05) / (L2 + 0.05) जहाँ L1 हल्के रंग का ल्यूमिनेंस है और L2 गहरे रंग का।
सटीक अनुपात
13.5891 से 1, दिखाया गया 13.58 से 1. दिखाई गई मात्रा काटकर दिखाई जाती है, गोल नहीं की जाती, इसलिए यह वास्तविकता से बेहतर कभी नहीं दिखती। सटीक मान वही है जिसकी आवश्यकता से तुलना की जाती है।

टेक्स्ट आकार: 16px, सामान्य (400)

सामान्य टेक्स्ट माना जाता है। बड़ा टेक्स्ट कम से कम 24px (18pt) होना चाहिए, या बोल्ड (वज़न 700 या अधिक) होने पर कम से कम 18.67px (14pt). आकार कट कर दिखाए जाते हैं, गोल नहीं किए जाते।

सामान्य टेक्स्ट माना जाता है। बड़ा टेक्स्ट कम से कम 24px (18pt) होना चाहिए, या बोल्ड (वज़न 700 या अधिक) होने पर कम से कम 18.67px (14pt). आकार कट कर दिखाए जाते हैं, गोल नहीं किए जाते।

Aa
पूर्वावलोकन शीर्षक

तेज़ भूरी लोमड़ी सुस्त कुत्ते के ऊपर कूदती है

छोटे पाठ का उदाहरण (12px)

पाठ
#000000
पृष्ठभूमि
#cdd0d6

WCAG मानक

स्तर AA

सामान्य पाठ के लिए न्यूनतम कंट्रास्ट अनुपात 4.5:1 और बड़े पाठ के लिए 3:1। अधिकांश वेबसाइटों के लिए आवश्यक।

स्तर AAA

सामान्य पाठ के लिए उन्नत कंट्रास्ट अनुपात 7:1 और बड़े पाठ के लिए 4.5:1। इष्टतम एक्सेसिबिलिटी के लिए अनुशंसित।

रंग कंट्रास्ट चेकर

पाठ और पृष्ठभूमि रंगों के कंट्रास्ट अनुपात की गणना करें।

पाठ और पृष्ठभूमि रंग के लिए रंग चयनकर्ता का उपयोग करके एक रंग चुनें या RGB हेक्साडेसिमल प्रारूप में एक रंग दर्ज करें (जैसे, #259 या #2596BE)। आप रंग चुनने के लिए स्लाइडर को समायोजित कर सकते हैं। वेब कंटेंट एक्सेसिबिलिटी गाइडलाइंस (WCAG) में यह निर्धारित करने के लिए एक विशिष्ट दिशा-निर्देश है कि क्या पाठ दृष्टि वाले उपयोगकर्ताओं के लिए पठनीय है। यह मानदंड रंग संयोजनों को तुलनीय अनुपात में मैप करने के लिए एक विशेष एल्गोरिदम का उपयोग करता है। इस सूत्र का उपयोग करते हुए, WCAG कहता है कि पाठ और इसकी पृष्ठभूमि के साथ 4.5:1 रंग कंट्रास्ट अनुपात नियमित (बॉडी) पाठ के लिए पर्याप्त है, और बड़े पाठ (18+ pt नियमित, या 14+ pt बोल्ड) के लिए कम से कम 3:1 रंग कंट्रास्ट अनुपात होना चाहिए।

मुख्य विशेषताएं

  • रियल-टाइम कंट्रास्ट अनुपात गणना
  • WCAG AA & AAA अनुपालन जांच
  • सूक्ष्म समायोजन के लिए HSL स्लाइडर्स
  • कई पूर्वावलोकन प्रारूप

उन्नत उपकरण

  • स्वचालित रंग सुधार
  • टेक्स्ट और पृष्ठभूमि नमूने
  • रंग नाम पहचान
  • परिणाम निर्यात करें

अक्सर पूछे जाने वाले प्रश्न

WCAG AA अनुपालन के लिए सामान्य टेक्स्ट को कम से कम 4.5:1 कंट्रास्ट अनुपात चाहिए, जबकि बड़े टेक्स्ट (18pt या 14pt बोल्ड) को 3:1 चाहिए।

WCAG AAA में अधिक कंट्रास्ट अनुपात चाहिए: सामान्य टेक्स्ट के लिए 7:1 और बड़े टेक्स्ट के लिए 4.5:1, जबकि AA में क्रमशः 4.5:1 और 3:1।

स्वचालित सुधार सुविधा से टेक्स्ट या बैकग्राउंड का रंग बदलें और अपने डिज़ाइन का उद्देश्य बनाए रखें, या दृश्य संकेतकों वाले HSL स्लाइडर से रंग खुद समायोजित करें, जो AA/AAA के लिए इष्टतम क्षेत्र दिखाते हैं।

हरे क्षेत्र और AA/AAA चिह्न WCAG अनुपालन के लिए इष्टतम रेंज दिखाते हैं। दिशा संकेत (अधिक हल्का/अधिक गहरा) आपके मौजूदा रंग संयोजन के आधार पर बेहतर कंट्रास्ट की ओर मार्गदर्शन करते हैं।

हाँ, आप कोई भी HEX रंग कोड दर्ज कर सकते हैं या कलर पिकर से अपने रंग चुन सकते हैं। URL अपने-आप अपडेट होता है, ताकि आप कोई खास रंग संयोजन साझा कर सकें।