सबके लिए पठनीय

एक बड़ा उपशीर्षक

कम कंट्रास्ट का सबसे बुरा असर मुख्य टेक्स्ट पर होता है, क्योंकि लोग उसे छोटे आकार में देर तक पढ़ते हैं। एक टेक्स्ट लिंक

बटन

टेक्स्ट रंग

टेक्स्ट अपारदर्शिता

पृष्ठभूमि रंग

रंग अंधता सिमुलेशन

थीम

रंग कंट्रास्ट के बारे में अधिक जानकारी

रंग कंट्रास्ट जाँचक

डिज़ाइन प्रकाशित करने से पहले जाँचें कि टेक्स्ट अपनी पृष्ठभूमि पर पढ़ने योग्य है या नहीं। टेक्स्ट रंग और पृष्ठभूमि रंग चुनें या टाइप करें, और जाँचक WCAG 2.x कंट्रास्ट अनुपात दिखाता है, साथ में सामान्य टेक्स्ट, बड़े टेक्स्ट और UI घटकों के लिए AA और AAA का पास या फ़ेल परिणाम। लाइव पूर्वावलोकन, रंग अंधता सिमुलेशन और सुझाए गए सुधार सही जोड़ी खोजने में मदद करते हैं। HEX, RGB या HSL में टेक्स्ट रंग और पृष्ठभूमि चुनें। WCAG कंट्रास्ट अनुपात, AA और AAA परिणाम और पूर्वावलोकन टाइप करते ही अपडेट होते हैं, और सबसे नज़दीकी पास होने वाले रंग सुझाए जाते हैं। सब कुछ इसी ब्राउज़र में सहेजा जाता है।

यह कैसे काम करता है

टेक्स्ट रंग और पृष्ठभूमि रंग चुनें, या उन्हें HEX, RGB या HSL में टाइप करें। टेक्स्ट अर्ध पारदर्शी हो तो टेक्स्ट अपारदर्शिता सेट करें।
सामान्य टेक्स्ट, बड़े टेक्स्ट और UI घटकों के लिए कंट्रास्ट अनुपात और AA व AAA बैज पढ़ें, और लाइव पूर्वावलोकन देखें।
जोड़ी फ़ेल हो तो सुझाया गया रंग लागू करें, अच्छी जोड़ियाँ पैलेट में सहेजें और CSS अपने प्रोजेक्ट में कॉपी करें।

सिर्फ़ अंक नहीं, सुधार भी

जब कोई जोड़ी फ़ेल होती है, जाँचक उसी ह्यू और संतृप्ति वाला सबसे नज़दीकी टेक्स्ट रंग और पृष्ठभूमि रंग खोजता है जो AA और AAA तक पहुँचे, और एक क्लिक से उसे लागू करता है। अर्ध पारदर्शी टेक्स्ट पहले पृष्ठभूमि के साथ मिलाया जाता है, ठीक वैसे ही जैसे ब्राउज़र उसे बनाता है।

निजी और पोर्टेबल

आपके रंग और पैलेट केवल इसी ब्राउज़र में सहेजे जाते हैं। बैकअप या दूसरे डिवाइस पर ले जाने के लिए सब कुछ JSON में सहेजें, या परिणाम को PDF या छवि के रूप में सहेजें। पूर्ववत और फिर से करें हर बदलाव पर काम करते हैं।

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

क्या रंग कंट्रास्ट जाँचक मुफ़्त है?

हाँ। यह मुफ़्त है, खाते की ज़रूरत नहीं और हर आधुनिक ब्राउज़र में चलता है।

मुझे कितना अनुपात चाहिए?

WCAG का AA स्तर सामान्य टेक्स्ट के लिए कम से कम 4.5:1 और बड़े टेक्स्ट तथा इनपुट बॉर्डर और आइकन जैसे UI घटकों के लिए 3:1 माँगता है। AAA स्तर सामान्य टेक्स्ट के लिए 7:1 और बड़े टेक्स्ट के लिए 4.5:1 माँगता है।

4.48 को पूर्णांकित करने पर 4.5 होता है, फिर भी फ़ेल क्यों?

WCAG की सीमाएँ सटीक हैं। 4.48:1 का अनुपात 4.5:1 से कम है, इसलिए सामान्य टेक्स्ट के लिए AA फ़ेल होता है। जाँचक बिना पूर्णांकित मान की तुलना करता है, इसलिए बैज हमेशा सख़्त रहते हैं।