நிற மாறுபாடு சரிபார்ப்பான்

உங்கள் நிறங்களைச் சரிபார்

உரை படிக்கக்கூடியதற்கான WCAG அணுகல் தரநிலைகளை பூர்த்தி செய்ய நிற சேர்க்கைகளைச் சோதிக்கவும்.

மாறுபாடு

AAA

உரை முடிவு

சூப்பர்

இப்போதிருத்தப்பட்டவை: #000000 மீது #F1F3F4

உரை

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
தேர்ச்சி

இதன் சரிபார்ப்பு எப்படி நடைபெறுகிறது

ஒப்பிடப்பட்ட நிறங்கள் (இடைமையாக்கம் பிறகு): உரை #000000 மீது பின்னணி #F1F3F4
ஒப்பீட்டு ஒளிர்வு: உரை 0.0000, பின்னணி 0.8933
சூத்திரம்: (L1 + 0.05) / (L2 + 0.05) இங்கே L1 என்பது ஒளிரும் நிறத்தின் ஒளிர்வு, L2 என்பது இருண்ட நிறத்தின் ஒளிர்வு.
துல்லிய விகிதம்: 18.8667 : 1, காட்சியில் 18.86 : 1. காட்சிக்கு காட்டப்படும் மதிப்பு வெட்டப்படுகின்றது, சுற்றமிடப்படாது, ஆகையாலே அது உண்மைக்கு மேம்பட்டு தெரியாது. துல்லிய மதிப்பு தான் தேவையுடன் ஒப்பிடப்படும்.

எழுத்து அளவு: 16px, சாதாரணம் (400)

சாதாரண உரையாக எண்ணப்படும். பெரிய உரை குறைந்தது 24px (18pt) ஆகும், அல்லது தடிமன் 700 அல்லது அதற்கு மேற்பட்ட போது குறைந்தது 18.67px (14pt). அளவுகள் வட்டமிடப்படாமல் கட் செய்யப்பட்டவையாக காட்டப்படும்.

தரநிலைகள்

உரை நிறம்

பின்னணி நிறம்

உரை அளவு (px)

எழுத்து தடிமன்

முன்னோட்ட தலைப்பு

வேகமான பழுப்பு நரி சோம்பேறி நாயின் மீது குதிக்கிறது

சிறிய உரை எடுத்துக்காட்டு (12px)

உரை

#000000

பின்புலம்

#f1f3f4

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 தானாகப் புதுப்பிக்கப்படும்.