پرش به محتوای اصلی
LibraTool logoLibraTool

تبدیل رنگ رایگان

رنگ‌ها را بین فرمت‌های HEX، RGB، HSL، HSV و CMYK فوری تبدیل کنید. شامل مقیاس روشنایی و نمونه رنگ‌های از پیش تعریف‌شده.

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

یک رنگ را بین HEX، RGB، HSL، HSV و CMYK تبدیل کنید — با پیش‌نمایش زنده و کپی یک‌لمسی. همه چیز در مرورگر شما اجرا می‌شود.

پشتیبانی از: HEX (#fff یا #ffffff)، RGB (255, 255, 255) یا HSL (360, 100%, 50%)

100%
پیش‌تنظیم‌ها:
HEX#14B8A6
rgb() · قدیمیrgb(20, 184, 166)
rgb() · مدرنrgb(20 184 166)
hsl() · قدیمیhsl(173, 80%, 40%)
hsl() · مدرنhsl(173 80% 40%)
oklch()oklch(70.4% 0.123 182.5)
lab()lab(67.1% -42.9 -2.3)
lch()lch(67.1% 43.0 183.1)
hsv()hsv(173, 89%, 72%)
cmyk()cmyk(89%, 0%, 10%, 28%)
مقادیر RGB20, 184, 166

کنتراست WCAG

بر روی پس‌زمینه سفید

۲٫۴۹:1

ناکام

بر روی پس‌زمینه سیاه

۸٫۴۴:1

AAA
🖨️ برای چاپ: این مقادیر CMYK (89%، 0%، 10%، 28%) یک تقریب استاندارد sRGB→CMYK برای مرجع هستند. برای رنگ چاپ دقیق، از پروفایل ICC چاپگر خود یا یک اثبات چاپ‌شده استفاده کنید — CMYK صفحه‌نمایش نمی‌تواند با هر جوهر/کاغذ مطابقت داشته باشد.

مقیاس روشنایی

روی هر نمونه کلیک کنید تا به آن سایه بروید

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

  • رنگ ها را برای طراحی وب تبدیل کنیدمقادیر HEX ، RGB و HSL را برای هر رنگ دریافت کنید — آماده اینجا در CSS یا Tailwind.
  • رنگ ها را برای چاپ تبدیل کنید (CMYK)رنگ های صفحه نمایش (HEX/RGB) را به مقادیر CMYK برای استفاده در طراحی چاپ و چاپ حرفه ای تبدیل کنید.
  • پالت رنگ برای سیستم های طراحی بسازیدرنگ های برند را در تمام قالب ها تبدیل کنید و مقیاس روشن کننده پایدار برای یک سیستم طراحی کامل ایجاد کنید.
  • بررسی تضاد رنگ برای دسترسی‌پذیریتبدیل رنگ‌ها برای دستیابی به مقادیر RGB برای استفاده در ابزارهای نسبت تضاد - انطباق WCAG برای طراحی قابل دسترسی.
  • تبدیل رنگ‌ها برای Figmaدریافت مقادیر دقیق HEX و RGB برای درج در انتخاب‌کننده‌های رنگ Figma و سیستم‌های نشانه‌ی طراحی.

نحوه کار

تمام منطق تبدیل جاوااسکریپت دست‌نویس است که کاملاً در مرورگر شما اجرا می‌شود — بدون کتابخانه، بدون تماس سروری. ابزار ورودی شما را تجزیه می‌کند، آن را از طریق زنجیره‌ای از توابع ریاضی خالص مسیریابی می‌کند، و همزمان یازده فرمت خروجی شامل فضاهای مدرن CSS Color 4 مانند oklch() و lab() تولید می‌کند.

  1. 1
    تجزیه ورودی انعطاف‌پذیر
    یک تجزیه‌گر سفارشی هگز (۳، ۴، ۶، یا ۸ رقمی)، rgb()/rgba()، hsl()/hsla() هم در سینتکس کامای قدیمی هم سینتکس فضایی مدرن، و سه‌گانه‌های عددی خالی را می‌پذیرد. مقادیر آلفا به‌صورت دهدهی یا درصد پیش از هر تبدیلی به بازه ۰ تا ۱ نرمال می‌شوند.
  2. 2
    RGB به‌عنوان محور تبدیل
    هر فرمت پذیرفته‌شده ابتدا به یک سه‌گانه RGB کانونی حل می‌شود. از آن نمایش واحد، ابزار پخش می‌شود: HSL و HSV از فرمول‌های استاندارد min/max/کروما استفاده می‌کنند؛ CMYK با یافتن کانال کلیدی استخراج می‌شود؛ و خطی‌سازی sRGB (منحنی گامای تکه‌ای تعریف‌شده در IEC 61966-2-1) پیش از محاسبات فضای دیداری اعمال می‌شود.
  3. 3
    فضاهای رنگ دیداری از صفر محاسبه‌شده
    oklch() با ماتریس‌های مرجع ۳×۳ بیورن اوتوسون (فضای ریشه-مکعبی LMS) محاسبه می‌شود. lab() و lch() از سازگاری رنگی برادفورد برای تبدیل از نقطه سفید D65 به D50 استفاده می‌کنند، که با نحوه تعریف lab() در CSS Color 4 مطابقت دارد. این‌ها همان فرمول‌هایی هستند که در موتورهای رندرینگ مرورگر استفاده می‌شوند — اینجا بدون هیچ وابستگی خارجی پیاده‌سازی شده‌اند.
  4. 4
    کنتراست WCAG و مقیاس روشنایی
    روشنایی نسبی طبق فرمول WCAG 2.1 محاسبه می‌شود (R، G، B خطی‌شده با وزن ۰٫۲۱۲۶/۰٫۷۱۵۲/۰٫۰۷۲۲) و نسبت کنتراست در برابر سفید و سیاه به‌صورت AA-بزرگ، AA، AAA، یا رد درجه‌بندی می‌شود. یک نوار نه‌مرحله‌ای روشنایی با گام‌برداری کانال روشنایی HSL از ۱۰٪ تا ۹۰٪ تولید می‌شود، که اجازه می‌دهد روی هر نمونه کلیک کنید تا آن سایه تبدیل شود.

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

🎨

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

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

امتحان کنید
🎨

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

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

امتحان کنید
🎨

تولید پالت رنگ

پالت‌های رنگی مکمل، مشابه، سه‌گانه و تک‌رنگ را از هر رنگ پایه تولید کنید. کدهای hex را با یک کلیک کپی کنید.

امتحان کنید

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