بررسی کنتراست رنگ رایگان WCAG. رنگ‌های متن و پس‌زمینه را برای مطابقت با قابلیت دسترسی AA و AAA با نسبت کنتراست زنده و پیش‌نمایش، هگز یا RGB آزمایش کنید.
نسبت کنتراست بین متن و رنگ پس‌زمینه را با استانداردهای WCAG AA و AAA با پیش‌نمایش زنده و ورودی هگز یا RGB بررسی کنید.
متن با کنتراست پایین یکی از رایج ترین اشکالات دسترسی است. این جستجوگر نسبت کنتراست دقیق بین متن و رنگ‌های پس‌زمینه را با استفاده از فرمول رسمی روشنایی نسبی WCAG محاسبه می‌کند، سپس به شما می‌گوید که آیا AA (4.5:1 برای متن معمولی، 3:1 برای متن بزرگ) و AAA دقیق‌تر (7:1 و 4.5:1) می‌گذرد. پیش نمایش زنده متن واقعی را روی رنگ های انتخابی شما نشان می دهد.
رنگ پیش زمینه را انتخاب یا تایپ کنید.
رنگ پس زمینه را انتخاب یا تایپ کنید.
نسبت کنتراست و نتایج AA/AAA را ببینید.
رنگ ها را تا زمانی که از بین بروند، دستکاری کنید.
از انتخابگرهای رنگ استفاده کنید یا کدهای هگز و مقادیر rgb() را مستقیماً تایپ کنید، ابزار هر دو را تجزیه می کند. همانطور که هر یک از رنگ ها را تنظیم می کنید، نشان های نسبت و پاس/عقب فوراً به روز می شوند، بنابراین می توانید یک سایه را تا زمانی که مطابقت داشته باشد، تکان دهید. همه چیز به صورت محلی اجرا می‌شود، و آن را به همراهی سریع در هنگام طراحی UI، مضامین و صفحات بازاریابی تبدیل می‌کند.
WCAG 2 کنتراست را از نسبت 1:1 (بدون کنتراست) تا 21:1 (سیاه روی سفید) اندازه گیری می کند. سطح AA، خط پایه معمول قانونی و صنعتی، حداقل به 4.5:1 برای متن معمولی و 3:1 برای متن بزرگ نیاز دارد، یعنی 24 پیکسل معمولی یا حدود 18.66 پیکسل و بالاتر. سطح AAA آنها را به 7:1 و 4.5:1 افزایش می دهد. بخش‌های رابط کاربری مانند حاشیه‌های ورودی، حلقه‌های فوکوس و نمادهایی که دارای معنا هستند، حداقل به نسبت 3:1 نسبت به محیط اطراف خود نیاز دارند. این نسبت از درخشندگی نسبی هر رنگ محاسبه می‌شود، بنابراین دو رنگی که متفاوت به نظر می‌رسند، اگر به همان اندازه روشن باشند، باز هم می‌توانند از کار بیفتند، که با قرمز روی سبز رایج است.
وقتی یک جفت از کار افتاد، به جای رنگ، روشنایی را تغییر دهید: متن را تیره کنید یا پس‌زمینه را در مراحل کوچک روشن کنید تا زمانی که نسبت از بین برود، و رنگ همچنان شبیه برند شما خواهد بود. رنگ‌های برند در رنگ‌های میانی، مانند رنگ نارنجی متوسط یا آبی، اغلب نمی‌توانند متن سفید را در AA حمل کنند. در این صورت از رنگ برند برای سرفصل‌ها، حاشیه‌ها یا پس‌زمینه‌های بزرگ استفاده کنید و متن بدنه را در سایه تیره‌تر قرار دهید. متن مکان‌نما و حالت‌های غیرفعال را نیز آزمایش کنید، زیرا اغلب بسیار کم رنگ هستند. به یاد داشته باشید که نسبت به فونت های نازک یا متن روی تصاویر مربوط نمی شود، بنابراین در این موارد حاشیه اضافی بگذارید.
برای AA، متن معمولی به 4.5:1 و متن بزرگ 3:1 نیاز دارد. برای AAA سخت‌گیرانه‌تر، متن معمولی به ۷:۱ و متن بزرگ ۴.۵:۱ نیاز دارد. متن بزرگ تقریباً 18pt یا 14pt پررنگ است.
از فرمول درخشندگی نسبی WCAG برای هر دو رنگ استفاده می کند، سپس روشنایی روشن تر (به اضافه 0.05) را بر تیره تر (به اضافه 0.05) تقسیم می کند و مقداری از 1:1 تا 21:1 می دهد.
بله: کدهای هگز مانند #1e293b یا rgb (30، 41، 59) را تایپ کنید یا از انتخابگرهای رنگ استفاده کنید. هر دو فرمت فورا تجزیه می شوند.
بله، کاملا رایگان و بدون ثبت نام، به طور کامل در مرورگر شما اجرا می شود.
مقادیر هگز متن و پس زمینه را وارد کنید. جستجوگر نسبت کنتراست را محاسبه می کند و نشان می دهد که آیا WCAG AA و AAA را برای متن معمولی و بزرگ پاس می کند یا خیر.
کنتراست کم خواندن متن را برای افراد کم بینا یا کوررنگ سخت می کند. رعایت نسبت‌های WCAG محتوا را برای همه خوانا نگه می‌دارد و یک نیاز رایج دسترسی و سئو است.
Tool GuidesPhotos carry hidden data like GPS location and camera details. Here's why that matters for privacy and how to strip it before sharing.
Tool GuidesCPS means clicks per second. Here's how it's measured, what a good score looks like, and how to test your own click speed for free.
Tool GuidesCombine several PDFs into one document, reorder the pages, and keep everything private — no software and no server upload.