કલર કોન્ટ્રાસ્ટ ચેકર

WCAG AA અને AAA સામે ફોરગ્રાઉન્ડ/બેકગ્રાઉન્ડ કોન્ટ્રાસ્ટ તપાસો. જેમ તમે રંગો પસંદ કરો છો તેમ રેશિયો અપડેટ જુઓ.

Color Contrast Checker

Live

Foreground (text)

Background

17.85:1

Contrast ratio

AA normal: PassAA large: PassAAA normal: PassAAA large: Pass

Readable headline sample

Body text at normal size should stay clear against this background. Adjust colors until WCAG targets pass.

Small caption text for density checks.

CSS output

color: #0f172a;
background-color: #ffffff;
/* contrast ratio: 17.85:1 */

Key capabilities

WCAG AA અને AAA માર્ગદર્શિકા સામે ફોરગ્રાઉન્ડ/બેકગ્રાઉન્ડ કોન્ટ્રાસ્ટ તપાસો.
તમારા બ્રાઉઝરમાં ચાલે છે
વાપરવા માટે મફત

કેવી રીતે ઉપયોગ કરવો

ટેક્સ્ટ (અગ્રભૂમિ) અને પૃષ્ઠભૂમિ રંગો પસંદ કરો.
કોન્ટ્રાસ્ટ રેશિયો અને AA/AAA પરિણામો વાંચો.
જ્યાં સુધી તમે તમારું લક્ષ્ય સ્તર પસાર ન કરો ત્યાં સુધી એડજસ્ટ કરો.

How this tool works

ટેક્સ્ટ (અગ્રભૂમિ) અને પૃષ્ઠભૂમિ રંગો પસંદ કરો.
કોન્ટ્રાસ્ટ રેશિયો અને AA/AAA પરિણામો વાંચો.
જ્યાં સુધી તમે તમારું લક્ષ્ય સ્તર પસાર ન કરો ત્યાં સુધી એડજસ્ટ કરો.

Recommended settings

પહેલા ડિફૉલ્ટ વિકલ્પોનો ઉપયોગ કરો, પછી જો જરૂરી હોય તો એડજસ્ટ કરો

Supported formats

Text / on-page input

File size and limits

જૂના ફોન પર ખૂબ જ જટિલ મલ્ટિ-લેયર પ્રીવ્યૂ ધીમા લાગે છે.

Privacy

રંગ અને CSS જનરેટર સંપૂર્ણપણે તમારા બ્રાઉઝરમાં ચાલે છે. પૂર્વાવલોકનો અને રૂપાંતરણો ક્યારેય તમારી શૈલીઓ અપલોડ કરતા નથી.

Common use cases

જ્યારે પણ તમને જરૂર હોય ત્યારે કલર કોન્ટ્રાસ્ટ ચેકરનો ઉપયોગ કરો: WCAG AA અને AAA માર્ગદર્શિકા સામે ફોરગ્રાઉન્ડ/બેકગ્રાઉન્ડ કોન્ટ્રાસ્ટ તપાસો.

Troubleshooting

પૂર્વાવલોકન પેસ્ટ કર્યા પછી અલગ દેખાય છે

તમારા પૃષ્ઠ પર સ્પર્ધાત્મક CSS માટે તપાસો (રીસેટ્સ, વારસાગત રંગો). જનરેટ કરેલ નિયમને પહેલા એક અલગ સ્ટાઈલશીટમાં કોપી કરો.

FAQ

શું આ મારું CSS અપલોડ કરે છે?

ના. જનરેટર અને કન્વર્ટર તમારા બ્રાઉઝરમાં લાઈવ પૂર્વાવલોકન સાથે ચાલે છે.

શું મારે એકાઉન્ટની જરૂર છે?

ના. ટૂલ ખોલો, નિયંત્રણોને ટ્વિક કરો અને CSS ની નકલ કરો.