रंग विरोधाभास तपासक

प्रवेशयोग्यता सुनिश्चित करण्यासाठी अग्रभाग आणि पार्श्वभूमीच्या रंगांमधील विरोधाभास गुणोत्तराची चाचणी करा.

तुमचे रंग तपासा

मजकूर वाचनक्षमता सुनिश्चित करण्यासाठी WCAG प्रवेशयोग्यता मानकांची पूर्तता करण्यासाठी रंग संयोजनांची चाचणी करा.

2.81 ते 1
विरोधाभास
अयशस्वी
मजकूर निकाल
खूप खराब

तुलना केली: #00A4E6 वर #FFFFFF

मजकूर

१६px, नियमित (400)

सामान्य मजकूर म्हणून गणना होते.

  • AA (WCAG 1.4.3): कमीतकमी 4.5:1

    अजून 1.69 आवश्यक

    अयशस्वी
  • AAA (WCAG 1.4.6): कमीतकमी 7:1

    अजून 4.19 आवश्यक

    अयशस्वी

UI घटक आणि ग्राफिक्स

आयकॉन्स, इनपुट बॉर्डर, फोकस इंडिकेटर आणि इंटरफेस वापरण्यासाठी तुम्हाला दिसणारे इतर भाग.

  • AA (WCAG 1.4.11): कमीतकमी 3:1

    अजून 0.19 आवश्यक

    अयशस्वी
2.81 ते 1. मजकूर: AA अपयशी, AAA अपयशी. UI घटक: अपयशी.
हे कसे तपासले जाते
तुलना केलेले रंग (ब्लेंड केल्यावर)
मजकूर #00A4E6 वर बॅकग्राऊंड #FFFFFF
सापेक्ष ल्युमिनन्स
मजकूर 0.3226, बॅकग्राऊंड 1.0000
सूत्र
(L1 + 0.05) / (L2 + 0.05) जिथे L1 हा उजळ रंगाचा ल्युमिनन्स आहे आणि L2 हा गडद रंगाचा ल्युमिनन्स आहे.
अचूक गुणोत्तर
2.8177 ते 1, दाखवलेले 2.81 ते 1. दाखवलेली किंमत कट करून दाखवली जाते, गोलाकार केली जात नाही, त्यामुळे ती कधीच जास्त चांगली दिसत नाही. अचूक किंमतच आवश्यकता तपासण्यासाठी वापरली जाते.

मजकूराचा आकार: १६px, नियमित (400)

सामान्य मजकूर म्हणून गणना होते. मोठा मजकूर म्हणजे किमान 24px (18pt), किंवा बोल्ड असताना (वजन 700 किंवा जास्त) किमान 18.67px (14pt). आकार कापलेले दाखवले जातात, गोल केलेले नाहीत.

सामान्य मजकूर म्हणून गणना होते. मोठा मजकूर म्हणजे किमान 24px (18pt), किंवा बोल्ड असताना (वजन 700 किंवा जास्त) किमान 18.67px (14pt). आकार कापलेले दाखवले जातात, गोल केलेले नाहीत.

त्वरित दुरुस्त्या

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

चपळ तपकिरी कोल्हा आळशी कुत्र्यावर उडी मारतो

लहान मजकूर उदाहरण (12px)

मजकूर
#00a4e6
पार्श्वभूमी
#ffffff

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.

तुमच्या डिझाइनचा हेतू कायम ठेवत मजकूर किंवा पार्श्वभूमी रंग समायोजित करण्यासाठी आमचे स्वयं-दुरुस्ती वैशिष्ट्य वापरा, किंवा AA/AAA अनुपालनासाठी इष्टतम क्षेत्रे दर्शविणाऱ्या दृश्य निर्देशकांसह HSL स्लायडर वापरून रंग हाताने समायोजित करा.

हिरवी क्षेत्रे आणि AA/AAA चिन्हे WCAG अनुपालन साध्य करण्यासाठी इष्टतम श्रेणी दर्शवतात. दिशादर्शक सूचना (उजळ/गडद) तुमच्या सध्याच्या रंग संयोजनावर आधारित अधिक चांगल्या विरोधाभासाकडे मार्गदर्शन करतात.

हो, तुम्ही कोणताही HEX रंग कोड प्रविष्ट करू शकता किंवा स्वतःचे रंग निवडण्यासाठी रंग निवडक वापरू शकता. URL आपोआप अद्यतनित होते, त्यामुळे तुम्ही विशिष्ट रंग संयोजन शेअर करू शकता.