چه کدهای رنگیای به من میدهد؟

HEX، RGB، HSL، HSV، CMYK و OKLCH برای همان رنگ، آمادهٔ کپی.

آیا میتوانم رنگی را از روی صفحهٔ نمایشم بردارم؟

بله، با «برداشتن از صفحه» در مرورگرهای مبتنی بر Chromium مانند Chrome و Edge. وقتی مرورگر شما از آن پشتیبانی نکند دکمه پنهان میشود.

آیا بررسی میکند که متن روی رنگ خوانا باشد؟

بله. نسبت کنتراست WCAG را در برابر سفید و سیاه نشان میدهد و آن را AA large، AA، AAA یا Fails علامت میزند. همچنین رنگهای مکمل، سهگانه، مجاور و تکرنگ را پیشنهاد میدهد.

آیا واقعاً رایگان است؟

بله. همه ابزارها رایگان هستند، بدون حساب کاربری و بدون کارت اعتباری. پردازش بهجای سرورهای ما روی دستگاه شما انجام میشود و همین است که رایگان ماندن آن را ممکن میکند.

آیا در موبایل کار میکند؟

بله. روی مرورگرهای امروزی موبایل در iOS و اندروید اجرا میشود و نیازی به نصب چیزی نیست.

🎨

انتخابگر رنگ و مولد پالت رایگان

رنگ انتخاب کنید، بین HEX/RGB/HSL تبدیل کنید و پالت‌های هماهنگ ایجاد کنید.

در مرورگر شما اجرا می‌شودبدون ثبت‌نام، بدون پاپ‌آپورود لازم نیسترایگان برای همیشه

پس از بارگذاری آفلاین کار می‌کند

انتخابگر رنگ

HEX

HSV

h217°

s76%

v96%

فقط نمایش

RGB

HSL

فرمت‌های بیشتر

آلفا100%

HEX8#3b82f6ff

RGBrgb(59 130 246)

HWBhwb(217 23% 4%)

CMYKcmyk(76%, 47%, 0%, 4%)

OKLCHoklch(62.3% 0.188 259.8)

SwiftUIColor(red: 0.231, green: 0.510, blue: 0.965, alpha: 1)

Android0xFF3B82F6

FlutterColor(0xFF3B82F6)

تضاد WCAG

نزدیک‌ترین رنگ نام‌دار: dodgerblue · متن سیاه اینجا خواناتر است (۵٫۷۱:1)

متن روی سفید۳٫۶۸:1AA بزرگ

متن روی سیاه۵٫۷۱:1AA

متن روی #ffffff۳٫۶۸:1AA بزرگ

مقایسه با رنگ دیگر

سایه‌ها و تینت‌ها (50–950)

نام

پالت رنگ

مکمل

#3b82f6

#f6af3c

سه‌تایی

#3b82f6

#f63c83

#83f63c

مشابه

#3ce0f6

#3b82f6

#523cf6

تک‌رنگ

#073c92

#0a5adb

#3b82f6

#85b2f9

#cee0fd

کاربردهای رایج

انتخاب کننده رنگ برای طراحی وبرنگ‌ها را برای وب‌سایت خود انتخاب کنید و ایجاد کنید — مقادیر HEX, RGB و HSL به علاوه پالت‌های هماهنگ دریافت کنید.
انتخاب کننده رنگ برای برندسازیپالت رنگی برند خود را بسازید — رنگ‌های اولیه، ثانویه و تاکیدی را انتخاب کنید که با هم کار می‌کنند.
انتخاب کننده رنگ برای رسانه‌های اجتماعیپالت‌های رنگی شگفت‌انگیز برای پست‌های رسانه‌های اجتماعی، داستان‌ها و طراحی‌های پروفیل ایجاد کنید.
انتخاب کننده رنگ برای طراحی چاپرنگ‌ها را برای مواد چاپی انتخاب کنید — بروشور، کارت ویزیت، نشریات — با پیش‌نمایش رنگ دقیق.
انتخاب کننده رنگ برای ارائه‌هارنگ‌های اسلاید را طراحی کنید — رنگ‌های متن خوانا، پالت نمودارها و تن‌های تاکید سازگار را انتخاب کنید.

نحوه کار

همه‌چیز مستقیماً در مرورگر شما با ریاضیات تبدیل دست‌نویس اجرا می‌شود — بدون کتابخانه رنگ، بدون رفت‌وبرگشت به سرور. رنگی را از طریق ورودی رنگ بومی مرورگر یا EyeDropper API انتخاب می‌کنید، و ابزار فوراً آن را به شش فرمت تبدیل می‌کند و همزمان نسبت‌های کنتراست WCAG را محاسبه و پالت‌های هارمونی تولید می‌کند.

1
ورودی رنگ از طریق API بومی
رنگی را از طریق ابزارک داخلی مرورگر <input type="color"> انتخاب می‌کنید، یا — در مرورگرهای مبتنی بر Chromium — EyeDropper API اجازه می‌دهد هر پیکسل صفحه‌تان را نمونه‌برداری کنید. هر دو مسیر یک رشته هگز برمی‌گردانند که منبع واحد حقیقت می‌شود.
2
تبدیل‌های فرمت دست‌نویس
ابزار مقدار هگز را به RGB، HSL، HSV، CMYK، و OKLCH با توابع ریاضی خودش تبدیل می‌کند (بدون کتابخانه خارجی). تبدیل OKLCH کانال‌های sRGB را خطی می‌کند، ماتریس ریشه-مکعبی OKLab را اعمال می‌کند، سپس کروما و زاویه فام را استخراج می‌کند — مطابق با خروجی مدرن CSS Color Level 4.
3
محاسبه نسبت کنتراست WCAG
روشنایی نسبی از کانال‌های RGB خطی‌شده با فرمول WCAG 2.x محاسبه می‌شود. سپس ابزار نسبت‌های کنتراست را در برابر سفید خالص و سیاه خالص محاسبه می‌کند و آن‌ها را طبق آستانه‌های WCAG (۳:۱، ۴٫۵:۱، ۷:۱) به‌صورت AA-بزرگ، AA، AAA، یا رد برچسب‌گذاری می‌کند.
4
تولید پالت هارمونی و ذخیره محلی
نمونه‌های مکمل، سه‌تایی، مشابه و تک‌رنگ با چرخش یا گام‌برداری ریاضی مقادیر فام و روشنایی HSL استخراج می‌شوند. پالت‌های ذخیره‌شده در localStorage مرورگر شما نوشته می‌شوند — چیزی از دستگاه شما خارج نمی‌شود.

ابزارهای مرتبط

🎨

تولیدکنندهٔ رنگ تصادفی

رنگ‌های تصادفی را یکی‌یکی یا به‌صورت پالت پنج‌تایی بسازید، رنگ‌های مورد علاقه را قفل کنید، مقدارهای HEX، RGB یا HSL را کپی کنید و پالت را به‌صورت PNG یا CSS خروجی بگیرید.

امتحان کنید

🎨