अग्रभूमि (टेक्स्ट)

पृष्ठभूमि

Contrast Ratio —

AA · Normal — Text < 18pt या < 14pt bold ≥ 4.5 : 1

AA · Large — Text ≥ 18pt या ≥ 14pt bold ≥ 3.0 : 1

AA · UI — Icons, borders, focus rings ≥ 3.0 : 1

AAA · Normal — Body text के लिए enhanced ≥ 7.0 : 1

AAA · Large — Headings के लिए enhanced ≥ 4.5 : 1

पूर्वावलोकन Edit करें

The Quick Brown Fox

Jumps over the lazy dog. यह sample दिखाता है कि आपका color combination अलग-अलग sizes में कैसा दिखता है।

छोटा text — 11px caption

22px — Large text · AA Large, AAA Large 14px — Normal text · AA Normal, AAA Normal 11px — AA से नीचे

Contrast ratios WCAG 2.1 के अनुसार calculate होते हैं। सब कुछ आपके browser में होता है।

Color Contrast Checker (WCAG 2.1)

यह tool क्या करता है

HEX format में foreground (text) color और background color enter करें, या color pickers उपयोग करें। Tool तुरंत WCAG 2.1 contrast ratio calculate करता है और पांच compliance levels के विरुद्ध जांचता है: AA Normal, AA Large, AA UI Components, AAA Normal, और AAA Large। Live preview दिखाता है कि आपका text उन colors के साथ कैसा दिखता है।

उपयोग कैसे करें

Color picker या HEX value type करके foreground color सेट करें।
उसी तरह background color सेट करें।
Contrast ratio पढ़ें और जांचें कि कौन से WCAG levels pass या fail हुए।
Colors reverse करने के लिए अदला-बदली उपयोग करें।