تبدیل‌کننده رنگ

یک کد رنگ هگز وارد کنید تا معادل‌های RGB و HSL آن را به همراه مقادیر جداگانه کانال‌های قرمز، سبز و آبی مشاهده کنید.

یک کد هگز ۶ رقمی بدون نماد # وارد کنید (مثلاً FF6B35).

رنگ

#FF6B35

RGBrgb(255, 107, 53)
HSLhsl(16, 100%, 60%)
کانال قرمز۲۵۵
کانال سبز۱۰۷
کانال آبی۵۳

نحوه استفاده از این مبدل رنگ

  1. کد رنگ هگز را وارد کنید

    یک کد هگز ۶ رقمی را در فیلد کد رنگ هگز وارد کنید (مثلاً FF6B35 یا 00FF88). نماد # را وارد نکنید.

  2. مقادیر RGB را بخوانید

    نتایج کانال‌های قرمز، سبز و آبی مقادیر ۰ تا ۲۵۵ را برای هر جزء نشان می‌دهند.

  3. خروجی HSL را بررسی کنید

    نتیجه HSL را برای فام (۰-۳۶۰ درجه)، اشباع و روشنایی بررسی کنید — برای تنظیمات رنگ مفید است.

روش‌شناسی

نحوه عملکرد این مبدل رنگ

این ابزار کد رنگ هگزادسیمال را به نمایش‌های RGB (قرمز، سبز، آبی) و HSL (فام، اشباع، روشنایی) تبدیل می‌کند. هر جفت هگز به یک مقدار کانال ۸ بیتی (۰–۲۵۵) نگاشت می‌شود و تبدیل HSL از ریاضیات استاندارد فضای رنگ استفاده می‌کند.

فرمول
R = hex[0:2] → اعشاری؛ G = hex[2:4] → اعشاری؛ B = hex[4:6] → اعشاری
HEX یک رشته ۶ کاراکتری از ارقام هگزادسیمال که نشان‌دهنده RGB است
HSL فام (۰–۳۶۰ درجه)، اشباع (۰–۱۰۰٪)، روشنایی (۰–۱۰۰٪)
مثال

Hex #FF6B35 → RGB(255, 107, 53) → HSL(16, 100%, 60%).

هگز 000000 → RGB(0, 0, 0) → HSL(0, 0%, 0%) — سیاه خالص.

هگز FFFFFF → RGB(255, 255, 255) → HSL(0, 0%, 100%) — سفید خالص. هگز 808080 → RGB(128, 128, 128) → HSL(0, 0%, 50%) — خاکستری متوسط.

مفروضات
  • ✓ ورودی یک کد رنگ هگز ۶ رقمی معتبر است.
  • ✓ کانال آلفا در این نسخه پشتیبانی نمی‌شود.
یادداشت‌ها
  • تبدیل CMYK به پروفایل رنگ نیاز دارد و در اینجا گنجانده نشده است.

درک مدل‌های رنگی

HEX، RGB و HSL روش‌های مختلفی برای توصیف یک رنگ واحد هستند. HEX کد RGB را به صورت یک رشته هگزادسیمال ۶ رقمی رمزگذاری می‌کند: هر جفت کاراکتر یک کانال ۸ بیتی (۰-۲۵۵) است. RGB همان مقادیر را به صورت سه عدد بیان می‌کند، رنگ‌های اصلی افزایشی که نمایشگرها ساطع می‌کنند. HSL (فام، اشباع، روشنایی) یک مدل استوانه‌ای است: فام زاویه در چرخه رنگ است (۰ درجه قرمز، ۱۲۰ درجه سبز، ۲۴۰ درجه آبی)، اشباع شدت رنگ است و روشنایی میزان درخشندگی است. طراحان اغلب هنگام تنظیم رنگ‌ها به صورت برنامه‌نویسی HSL را ترجیح می‌دهند — تغییر روشنایی به تنهایی باعث تیره یا روشن شدن رنگ بدون تغییر فام می‌شود و تنظیم اشباع، زنده بودن رنگ را تغییر می‌دهد.

موارد استفاده توسعه‌دهندگان برای تبدیل رنگ

توسعه‌دهندگان هنگام ساخت سیستم‌های طراحی، پیاده‌سازی تم‌ها، تولید پالت‌های رنگی و عیب‌یابی CSS رنگ‌ها را تبدیل می‌کنند. توکن‌های طراحی اغلب رنگ‌ها را در قالب هگز ذخیره می‌کنند؛ تبدیل به RGB یا HSL محاسبات زمان اجرا مانند لایه‌های شفافیت یا بررسی‌های کنتراست دسترسی‌پذیری را امکان‌پذیر می‌کند. سوئیچرهای تم ممکن است نیاز داشته باشند با استفاده از HSL، نسخه‌های روشن‌تر یا تیره تر را از یک رنگ پایه مشتق کنند. ابزارهای خودکار دسترسی‌پذیری، رنگ‌ها را برای محاسبه درخشندگی و نسبت‌های کنتراست تبدیل می‌کنند. هنگام عیب‌یابی باگ‌های چیدمان یا تم، مشاهده مقدار هگز به صورت RGB یا HSL به شناسایی کانال نامناسب کمک می‌کند. تبدیل رنگ همچنین در بصری‌سازی داده‌ها، کتابخانه‌های نمودار و تم‌بندی پویا رابط کاربری استفاده می‌شود.

سوالات متداول

آیا می‌توانم یک کد هگز ۳ رقمی وارد کنم؟

در حال حاضر این ابزار به یک کد ۶ رقمی نیاز دارد. برای کدهای کوتاه ۳ رقمی مانند F60، ابتدا آن را به FF6600 تبدیل کنید.

HSL چیست؟

HSL مخفف Hue (فام)، Saturation (اشباع) و Lightness (روشنی) است. این یک روش جایگزین برای توصیف رنگ‌هاست که برخی طراحان آن را بصری‌تر از RGB می‌دانند.

نوشته شده توسط یان کرنک مؤسس و توسعه‌دهنده اصلی
بازبینی شده توسط بررسی متدولوژی DigitSum تأیید فرمول و تضمین کیفیت
آخرین به‌روزرسانی ۲۰ اسفند ۱۴۰۴

از این به عنوان یک تخمین استفاده کنید و تصمیمات مهم را با یک متخصص واجد شرایط تأیید نمایید.

ورودی‌ها در مرورگر باقی می‌مانند، مگر اینکه در آینده قابلیتی خلاف آن را صراحتاً اعلام کند.