मुख्य सामग्री पर जाएँ

रंग कंट्रास्ट जाँच — WCAG AA/AAA

सामान्य और बड़े टेक्स्ट के लिए WCAG AA / AAA सीमाओं से कंट्रास्ट अनुपात देखने के लिए अग्रभूमि और पृष्ठभूमि hex मान दर्ज करें। लॉन्च से पहले सफ़ेद पर फीका ग्रे पकड़ें — आपके लिए पठनीय सबके लिए पठनीय नहीं।

Sample text Aa

कंट्रास्ट अनुपात: 18.88

AA सामान्य टेक्स्ट (≥4.5)पास
AA बड़ा टेक्स्ट (≥3)पास
AAA सामान्य टेक्स्ट (≥7)पास

कंट्रास्ट अनुपात मुख्य पहुँच मेट्रिक है। ऊँची संख्याएँ पृष्ठभूमि पर स्पष्ट टेक्स्ट मतलब। WCAG बॉडी कॉपी बनाम बड़े बोल्ड हेडिंग के लिए अलग बार सेट करता है।

यह त्वरित डिज़ाइन जाँच है, पूर्ण ऑडिट नहीं — फ़ोकस क्रम, स्क्रीन रीडर और कीबोर्ड पथ भी मायने रखते हैं।

जब ब्रांड रंग बहुत हल्के हों, उपयोगकर्ताओं से सिकोड़ने को कहने के बजाय टेक्स्ट गहरा करें या बैकिंग प्लेट जोड़ें।

कैसे जाँचें

  1. अग्रभूमि और पृष्ठभूमि hex दर्ज करें
  2. अनुपात और AA/AAA संकेत पढ़ें
  3. लक्ष्य तक रंग समायोजित करें

कंट्रास्ट जाँच क्या पकड़ती है

  • कम-दृष्टि पाठकों के लिए तनाव घटाएँ।
  • अपठनीय ग्रे पर कम डिज़ाइन समीक्षा लूप।
  • संख्याएँ «मुझे लगता ठीक है» बहस सुलझाती हैं।

परिदृश्य

  • बटन लेबल बनाम भर रंग
  • हल्के ग्रे में फ़ुटर लिंक
  • टिंटेड पैनल पर डार्क मोड टेक्स्ट

सुझाव

  • बॉडी टेक्स्ट की सीमाएँ बड़े डिस्प्ले टाइप से सख्त — फिर भी ऊँचा लक्ष्य रखें।
  • आइकन को भी पहचानने योग्य कंट्रास्ट चाहिए।
  • ग्रेडिएंट पर, टेक्स्ट के पीछे वास्तव में मौजूद रंग सैंपल करें।

संदर्भ

इनपुटआउटपुटनोट
सफ़ेद पर गहरा टेक्स्टआमतौर पर AA पाससामान्य बॉडी कॉपी
सफ़ेद पर हल्का ग्रेअक्सर फ़ेलटेक्स्ट या पृष्ठभूमि गहरा करें

कंट्रास्ट FAQ

AA बनाम AAA?
AAA सख्त है। कई उत्पाद न्यूनतम AA लक्ष्य करते हैं; जब हो सके AAA।
बड़ा टेक्स्ट क्या गिना जाता है?
लगभग बड़ा नियमित आकार या मध्यम आकार पर बोल्ड — पेज सामान्य सीमाएँ लागू करता है।
रंग-अंध उपयोगकर्ता?
कंट्रास्ट मदद करता है, लेकिन स्थिति बताने के लिए केवल रंग पर भरोसा न करें।

संबंधित टूल