रंग कंट्रास्ट जाँचें — WCAG AA / AAA
मुफ़्त WCAG कंट्रास्ट जाँच। अग्रभूमि/पृष्ठभूमि hex को AA और AAA से परखें।
Sample text Aa
कंट्रास्ट अनुपात: 3.15:1
AA सामान्य टेक्स्ट (≥4.5)फ़ेल
AA बड़ा टेक्स्ट (≥3)पास
AAA सामान्य टेक्स्ट (≥7)फ़ेल
सुझाव: अग्रभूमि गहरा करें या पृष्ठभूमि हल्की करें — AA पास करना आसान हो जाता है।
निजी · तेज़ · मुफ़्त
कंट्रास्ट अनुपात मुख्य पहुँच मेट्रिक है। ऊँची संख्याएँ पृष्ठभूमि पर स्पष्ट टेक्स्ट मतलब। WCAG बॉडी कॉपी बनाम बड़े बोल्ड हेडिंग के लिए अलग बार सेट करता है।
यह त्वरित डिज़ाइन जाँच है, पूर्ण ऑडिट नहीं — फ़ोकस क्रम, स्क्रीन रीडर और कीबोर्ड पथ भी मायने रखते हैं।
जब ब्रांड रंग बहुत हल्के हों, उपयोगकर्ताओं से सिकोड़ने को कहने के बजाय टेक्स्ट गहरा करें या बैकिंग प्लेट जोड़ें।
कैसे जाँचें
- अग्रभूमि और पृष्ठभूमि hex दर्ज करें
- अनुपात और AA/AAA संकेत पढ़ें
- लक्ष्य तक रंग समायोजित करें
Contrast जाँच से क्या मिलता है
- कम-दृष्टि पाठकों के लिए तनाव घटाएँ।
- अपठनीय ग्रे पर कम डिज़ाइन समीक्षा लूप।
- संख्याएँ «मुझे लगता ठीक है» बहस सुलझाती हैं।
परिदृश्य
- बटन लेबल बनाम भर रंग
- हल्के ग्रे में फ़ुटर लिंक
- टिंटेड पैनल पर डार्क मोड टेक्स्ट
सुझाव
- बॉडी टेक्स्ट की सीमाएँ बड़े डिस्प्ले टाइप से सख्त — फिर भी ऊँचा लक्ष्य रखें।
- आइकन को भी पहचानने योग्य कंट्रास्ट चाहिए।
- ग्रेडिएंट पर, टेक्स्ट के पीछे वास्तव में मौजूद रंग सैंपल करें।
संदर्भ
| इनपुट | आउटपुट | नोट |
|---|---|---|
| सफ़ेद पर गहरा टेक्स्ट | आमतौर पर AA पास | सामान्य बॉडी कॉपी |
| सफ़ेद पर हल्का ग्रे | अक्सर फ़ेल | टेक्स्ट या पृष्ठभूमि गहरा करें |
Contrast FAQ
- AA बनाम AAA?
- AAA सख्त है। कई उत्पाद न्यूनतम AA लक्ष्य करते हैं; जब हो सके AAA।
- बड़ा टेक्स्ट क्या गिना जाता है?
- लगभग बड़ा नियमित आकार या मध्यम आकार पर बोल्ड — पेज सामान्य सीमाएँ लागू करता है।
- रंग-अंध उपयोगकर्ता?
- कंट्रास्ट मदद करता है, लेकिन स्थिति बताने के लिए केवल रंग पर भरोसा न करें।