بررسی کنتراست رنگ

کنتراست پیش زمینه/پس زمینه را در برابر 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 بررسی کنید.
در مرورگر شما اجرا می شود
رایگان برای استفاده

How to use

رنگ متن (پیش زمینه) و پس زمینه را انتخاب کنید.
نسبت کنتراست و نتایج 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 رقیب را در صفحه خود بررسی کنید (بازنشانی، رنگ های ارثی). ابتدا قانون تولید شده را در یک stylesheet ایزوله کپی کنید.

FAQ

آیا این CSS من را آپلود می کند؟

خیر. ژنراتورها و مبدل ها در مرورگر شما با پیش نمایش زنده اجرا می شوند.

آیا به یک حساب کاربری نیاز دارم؟

نه. ابزار را باز کنید، کنترل ها را تغییر دهید و CSS را کپی کنید.