محول RGB إلى HEX — يحول قيم RGB إلى رموز سداسية عشرية، والرموز السداسية العشرية إلى RGB، مع معاينة فورية.

أدخل الأرقام باللون الأحمر والأخضر والأزرق، أو اختر لونًا، أو الصق رمزًا سداسيًا عشريًّا، وشاهد جميع التنسيقات دفعة واحدة: HEX وRGB وHSL. تتيح لك المعاينة المباشرة وفحص التباين معرفة لون النص الأنسب. كل ذلك يعمل مباشرةً في متصفحك.

تحويل لون تظل الألوان الخاصة بك محفوظة في متصفحك
محول من RGB إلى HEX مزود بمعاينة اللون، وحقول لإدخال قيم RGB، ورمز سداسي عشري

اختر لونًا أو اكتب اسمه

آ

رموز الألوان

HEX
–
RGB (CSS)
–
HSL (CSS)
–
– أفضل لون للنص عليه
–نسبة التباين
الدليل

دليل التحويل من RGB إلى HEX: رموز الألوان، ونظام HSL، والتباين

تعرف على كيفية عمل رموز الألوان وكيفية اختيار أزواج الألوان التي يسهل قراءتها.

شرح بسيط

ما هي وظيفة محول RGB إلى HEX؟

تُنتج الشاشات كل الألوان عن طريق مزج الضوء الأحمر والأخضر والأزرق. ويُعبِّر نظام RGB عن هذا المزيج بثلاثة أرقام تتراوح بين 0 و255. أما نظام HEX فيُعبِّر عن نفس الأرقام الثلاثة بنظام العد السداسي عشري كرمز مختصر مثل #1F3A5F، وهو ما تستخدمه عادةً لغة CSS وأدوات التصميم وأدلة العلامات التجارية.

أدخل الأرقام الثلاثة، أو اختر لونًا باستخدام أداة الاختيار، أو الصق رمزًا سداسيًا عشريًّا. يتم تحديث جميع التنسيقات معًا، كما تحصل أيضًا على نسخة بتنسيق HSL، بالإضافة إلى فحص يحدد لون النص الأكثر قابلية للقراءة عليها.

الأسباب الشائعة للتحويل

لماذا يقوم الناس بتحويل RGB إلى HEX

تصميم المواقع الإلكترونية و CSS

حوّل لونًا من ملف تصميم أو من أداة اختيار لقطة الشاشة إلى الرمز السداسي العشري الذي تحتاجه ورقة الأنماط الخاصة بك.

العلامة التجارية والوثائق

احرص على اتساق لون العلامة التجارية بين ملف الشعار ومجموعة الشرائح والموقع الإلكتروني.

إمكانية الوصول

تحقق من لون النص الأنسب للخلفية واطلع على نسبة التباين قبل النشر.

الحسابات الكامنة وراء ذلك

كيف يتحول نظام RGB إلى نظام HEX

يتم تحويل كل رقم من الأرقام الثلاثة إلى قيمة مكونة من رقمين بنظام العد السداسي عشر، ثم يتم ربط الأزواج الثلاثة معًا.

RGB: 31، 58، 95 31 = 1F (1 × 16 + 15) 58 = 3A (3 × 16 + 10) 95 = 5F (5 × 16 + 15) HEX: #1F3A5F

تستخدم القاعدة السداسية العشرية الأرقام من 0 إلى 9 والحروف من A إلى F، حيث يمثل الحرف A الرقم 10 والحرف F الرقم 15. والرمز المختصر مثل #FA0 هو اختصار: حيث يتم مضاعفة كل رقم، لذا فإنه يعني #FFAA00.

أرقام مفيدة

الألوان الشائعة في نظامي RGB وHEX

اللونRGBHEX
أسود0, 0, 0#000000
أبيض255, 255, 255#FFFFFF
أحمر255, 0, 0#FF0000
أخضر0, 255, 0#00FF00
أزرق0, 0, 255#0000FF
أصفر255, 255, 0#FFFF00
البرتقالي255, 165, 0#FFA500
رمادي128, 128, 128#808080
التحويل في بضع خطوات

كيفية استخدام محول RGB إلى HEX

  1. اكتب قيم الألوان الأحمر والأخضر والأزرق، أو انقر على عينة اللون لاستخدام أداة اختيار الألوان.
  2. أو الصق رمزًا سداسيًا عشريًّا في حقل «Hex» للقيام بالعكس.
  3. اقرأ رموز HEX وRGB وHSL، وتحقق من نسبة التباين ولون النص الأمثل.
  4. اضغط على «نسخ» بجانب التنسيق الذي تريده.
نتائج أفضل

نصائح بسيطة للتعامل مع الألوان

  • لضمان قابلية قراءة النص، احرص على أن تبلغ نسبة التباين 4.5 : 1 على الأقل للنص العادي و3 : 1 للنص الكبير.
  • لا تُفرق رموز الهيكس بين الأحرف الكبيرة والصغيرة، لذا فإن #1f3a5f و#1F3A5F يمثلان نفس اللون.
  • الرقم # في بداية السطر ضروري في CSS، لكنه اختياري هنا. يمكنك لصق الأكواد سواء كان موجودًا أم لا.
  • تختلف طريقة عرض الألوان بين الشاشات والطابعات، لذا قد لا يتطابق اللون المطبوع مع ما تراه على الشاشة.
معلومات مفيدة

القيود والخصوصية

الخصوصية

يتم تحويل الألوان في متصفحك. ولا يتم إرسال أي بيانات إلى خادمنا أو تخزينها. ولا يتم حفظ سوى اختيار الأحرف الصغيرة على جهازك.

القيود

تعمل الأداة مع ألوان sRGB القياسية ذات 8 بت، بقيم تتراوح من 0 إلى 255 لكل قناة. ولا تدعم الأداة الشفافية (RGBA أو الرموز السداسية العشرية المكونة من 8 أرقام)، ولا نظام CMYK المخصص للطباعة، ولا مساحات الألوان ذات النطاق الواسع.

الأسئلة الشائعة

الأسئلة الشائعة حول محول RGB إلى HEX

كيف يمكنني تحويل RGB إلى HEX؟

أدخل قيم الألوان الأحمر والأخضر والأزرق، بحيث تتراوح كل منها بين 0 و255. تقوم الأداة بتحويل كل رقم إلى رقمين بنظام العد السداسي عشري وربطهما معًا، لذا فإن الأرقام 31 و58 و95 تصبح #1F3A5F.

كيف يمكنني تحويل نظام HEX إلى نظام RGB؟

الصق الرمز السداسي العشري في حقل «Hex». ستظهر الأرقام الثلاثة الخاصة بـ RGB تلقائيًّا. على سبيل المثال، الرمز #FF8800 يساوي 255، 136، 0.

هل يحتاج الرمز السداسي عشري إلى علامة #؟

لا. يمكنك كتابته مع أو بدون علامة #، كما أن الرموز المختصرة مثل #FA0 تعمل أيضًا. تتضمن النتيجة دائمًا علامة #، لذا فهي جاهزة للاستخدام مع CSS.

ماذا تعني الأرقام الثلاثة الخاصة بـ RGB؟

وهي تمثل شدة الضوء الأحمر والأخضر والأزرق، من 0 (لا شيء) إلى 255 (كامل). القيمة 0، 0، 0 تعني اللون الأسود، بينما القيمة 255، 255، 255 تعني اللون الأبيض.

ما الغرض من قيمة HSL؟

يصف نموذج HSL اللون من خلال التدرج اللوني والتشبع والسطوع. وغالبًا ما يكون من الأسهل ضبط هذه القيم يدويًّا، على سبيل المثال لجعل اللون أفتح قليلاً، كما أنه يعمل مباشرةً في CSS.

ما الذي تخبرني به نسبة التباين؟

يُظهر هذا مدى بروز النص الأسود أو الأبيض على لون الخلفية. وتُعد النسبة 4.5 : 1 أو أكثر الحد الأدنى المعتاد للنص العادي وفقًا لإرشادات إمكانية الوصول WCAG.

هل يمكنني إضافة عنصر الشفافية؟

ليس هنا. هذه الأداة تتعامل مع الألوان غير الشفافة فقط، دون قناة ألفا. للحصول على الشفافية، أضف قيمة ألفا بنفسك في rgba() في CSS الخاص بك.

هل يتم حفظ بياناتي أو إرسالها إلى أي مكان؟

لا. تتم عملية التحويل داخل متصفحك ولا يتم إرسال أي بيانات خارج جهازك. ولا يتم حفظ سوى اختيارك للأحرف الصغيرة لاستخدامه في المرة القادمة.

من مستخدمي هذه الأداة

التعليقات

جاري تحميل التقييمات…
استمر

المزيد من الأدوات في الصندوق

تضم الصفحة الرئيسية عشرات الأدوات المجانية الأخرى التي لا تتطلب مفتاح واجهة برمجة التطبيقات (API).

اقترح أداة