كيفية التحويل بين تنسيقات الألوان HEX وRGB وHSL وغيرها

حوّل لونًا بين تنسيقات HEX وRGB وHSL وCMYK وغيرها، وتعرّف على التحويلات الدقيقة والتنسيق المناسب لكل استخدام.

دقيقتان للقراءة


أداة تحويل الألوان بعد إدخال #ff6600 كقيمة مصدر، مع ظهور rgb(255, 102, 0) كنتيجة RGB وعينة برتقالية أسفلها
أداة تحويل الألوان بعد إدخال #ff6600 كقيمة مصدر، مع ظهور rgb(255, 102, 0) كنتيجة RGB وعينة برتقالية أسفلها

لتحويل لون، الصقه في أداة تحويل الألوان. اختر التنسيق الذي تريده ضمن «الهدف»، ثم انسخ النتيجة. تتعرّف الأداة تلقائيًا على تنسيق الإدخال، لذا تعمل الصيغ #ff6600 وrgb(255, 102, 0) وorangered وحتى 255, 102, 0. تظهر النتيجة أثناء الكتابة. وتُظهر لك عينة اللون أسفل النتيجة أن الأداة قرأت اللون الصحيح.

اللون نفسه بأربعة تنسيقات

HEX وRGB وHSL وCMYK طرق مختلفة لكتابة اللون نفسه. إليك لونًا برتقاليًا بالتنسيقات الأربعة:

التنسيق القيمة مدلول الأرقام
HEX #ff6600 الأحمر والأخضر والأزرق، ويُمثّل كل منها برقمين بالنظام الست عشري
RGB rgb(255, 102, 0) الأحمر والأخضر والأزرق بقيم من 0 إلى 255
HSL hsl(24, 100%, 50%) درجة اللون على عجلة الألوان، والتشبع، والإضاءة
CMYK cmyk(0%, 60%, 100%, 0%) أحبار السماوي والأرجواني والأصفر والأسود

يستخدم HEX وRGB الأرقام الثلاثة نفسها، لكن تُكتب بطريقة مختلفة. والتحويل بينهما دقيق. أما HSL فيسهّل تعديل اللون يدويًا: ارفع قيمة الإضاءة، فيصبح اللون أفتح.

لماذا يختلف CMYK؟

يُستخدم CMYK للطباعة، وتعتمد القيم الدقيقة على الطابعة والورق والحبر. تستخدم أداة التحويل الصيغة القياسية من دون ملف تعريف للطابعة، لذا قد يعطيك المطبعة قيمًا مختلفة قليلًا للون نفسه. استخدم نتيجة CMYK للنماذج التجريبية، واطلب من المطبعة نسخة تجريبية قبل الطباعة الفعلية.

أي تنسيق تستخدم؟

  • CSS وHTML: استخدم HEX. فهو مختصر وتقرأه كل المتصفحات.
  • سمة الألوان: استخدم HSL. يمكنك الحصول على درجات أفتح وأغمق بتغيير رقم واحد.
  • الشفافية في التعليمات البرمجية: استخدم RGB مع قيمة ألفا، أو HEX من ثمانية أرقام. تصبح rgba(37, 99, 235, 0.5) على شكل #2563eb80، ويمثل الرقمان الأخيران مستوى العتامة.
  • نماذج الطباعة التجريبية: استخدم CMYK، وتذكّر الملاحظة أعلاه.

أسماء الألوان ليست دقيقة

تدعم أداة التحويل 17 تنسيقًا، منها OKLCH وLAB وHSV وأسماء ألوان CSS ورموز ANSI للطرفية. نتيجة اسم اللون هي أقرب اسم لون في CSS، وليست تطابقًا دقيقًا. تعطي #ff6600 الاسم orangered، لكن قيمة orangered الفعلية هي #ff4500. استخدم الأسماء للتسميات السريعة، واستخدم القيم الدقيقة لألوان العلامة التجارية.

الصق اللون، وتحقق من عينة اللون، ثم انسخ النتيجة. هذه هي العملية كلها.

هل أنت مستعد لتجربتها بنفسك؟


محول الألوان

حوّل الألوان بين HEX وRGB وHSL وHSV وHWB وCMYK وLAB وLCH وOKLab وOKLCH وXYZ وأسماء ألوان CSS ورموز ANSI للطرفية وغيرها، مع اكتشاف تلقائي للصيغة ومعاينة مباشرة.

افتح الأداة

مشاركة