تبدیل رنگ (HEX ↔ RGB ↔ HSL)

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

  • نتیجهٔ فوری
  • اجرا در مرورگر شما
  • رایگان، بدون ثبت‌نام

تبدیل رنگ (HEX ↔ RGB ↔ HSL)

چطور رنگ را تبدیل کنم؟

  1. در «مبدأ تبدیل» بگویید کد شما از کدام نوع است: از HEX، از RGB یا از HSL.
  2. فقط فیلدهای همان نوع را پر کنید؛ مثلاً برای HEX کدی مثل #3B82F6.
  3. هر سه فرمت و پیش‌نمایش رنگ همان لحظه نمایش داده می‌شود. با «کپی» هر سه را یک‌جا بردارید.

نکته: R، G و B بین ۰ تا ۲۵۵ هستند؛ H بین ۰ تا ۳۶۰ درجه است و S و L درصد.

یک مثال

آبی #3B82F6 در سه فرمت:

فرمتمقدار
HEX#3B82F6
RGB۵۹، ۱۳۰، ۲۴۶
HSLحدود ۲۱۷ درجه، ۹۱٪، ۶۰٪

HEX و RGB همان سه عدد قرمز، سبز و آبی‌اند؛ HSL رنگ را با فام، اشباع و روشنایی می‌گوید و برای ساختن نسخهٔ روشن‌تر یا تیره‌تر یک رنگ راحت‌تر است.

پرسش‌های رایج

کدام فرمت را در CSS استفاده کنم؟

هر سه در CSS کار می‌کنند. HEX کوتاه‌تر است؛ HSL وقتی می‌خواهید فقط روشنایی را کم و زیاد کنید راحت‌تر است.

چرا گاهی عدد کمی گرد می‌شود؟

RGB به عدد صحیح گرد می‌شود؛ برای همین تبدیل رفت‌وبرگشت ممکن است یک واحد فرق کند که با چشم دیده نمی‌شود.