كيفية تحويل hex إلى RGB
- اكتب أو الصق كود لون hex في حقل كود اللون hex، مع
#أو بدونها، أو انقر على مربع اللون لاختيار لون. - اقرأ النتيجة بصيغة
rgb()وشاهد قيم الأحمر والأخضر والأزرق على أشرطة التمرير، إلى جانب HSL وHSV وCMYK. - انسخ أي صيغة بنقرة واحدة. وتوضّح المعادلة بجانب الصيغ كيف يتحول كل زوج من أرقام hex إلى عدد من 0 إلى 255.
معادلة تحويل hex إلى RGB
كود اللون hex عبارة عن ثلاثة بايتات مكتوبة بالنظام السداسي عشر: #RRGGBB. كل زوج من الأرقام يمثّل قناة واحدة من 00 (0) إلى FF (255). لتحويل زوج، اضرب الرقم الأول في 16 وأضف الرقم الثاني، مع اعتبار A = 10 وB = 11 وC = 12 وD = 13 وE = 14 وF = 15. مثال على #7C3AED:
- الأحمر:
7C= 7 × 16 + 12 = 124 - الأخضر:
3A= 3 × 16 + 10 = 58 - الأزرق:
ED= 14 × 16 + 13 = 237
إذن #7C3AED = rgb(124, 58, 237).
أكواد hex المختصرة والشفافة
الكود المكوّن من 3 أرقام هو صيغة مختصرة يتكرر فيها كل رقم مرتين: #F80 = #FF8800 = rgb(255, 136, 0). أما الكود المكوّن من 8 أرقام فيضيف بايت ألفا للعتامة: في #7C3AED80 يكون الزوج الأخير 80 = 128، و128 ÷ 255 ≈ 0.5، لذا فهو يساوي rgba(124, 58, 237, 0.5). وتعمل الصيغة المكوّنة من 4 أرقام #RGBA بالطريقة نفسها.
أكواد الألوان hex الشائعة وقيمها في RGB
| اللون | Hex | RGB |
|---|---|---|
| أبيض | #FFFFFF | rgb(255, 255, 255) |
| أسود | #000000 | rgb(0, 0, 0) |
| أحمر | #FF0000 | rgb(255, 0, 0) |
| ليموني | #00FF00 | rgb(0, 255, 0) |
| أزرق | #0000FF | rgb(0, 0, 255) |
| أصفر | #FFFF00 | rgb(255, 255, 0) |
| برتقالي | #FFA500 | rgb(255, 165, 0) |
| رمادي | #808080 | rgb(128, 128, 128) |
| كحلي | #000080 | rgb(0, 0, 128) |
| أرجواني | #800080 | rgb(128, 0, 128) |
| أزرق مخضر | #008080 | rgb(0, 128, 128) |
الأسئلة الشائعة
كيف أحوّل hex إلى RGB يدويًا؟
قسّم الكود إلى ثلاثة أزواج وحوّل كل زوج من النظام السداسي عشر: الرقم الأول × 16 + الرقم الثاني. بالنسبة إلى #1E90FF: 1E = 30، و90 = 144، وFF = 255، إذن اللون هو rgb(30, 144, 255).
ماذا يعني كود لون hex من 3 أرقام مثل #F80؟
إنه اختصار لكود من 6 أرقام يتكرر فيه كل رقم مرتين: #F80 = #FF8800 = rgb(255, 136, 0). ولا يمكن اختصار إلا الألوان التي يتكوّن كل زوج فيها من رقمين متطابقين.
كيف أحوّل hex إلى RGB في JavaScript أو Python؟
في JavaScript: [1, 3, 5].map((i) => parseInt(hex.slice(i, i + 2), 16)) لكود مثل #RRGGBB. في Python: tuple(int(h[i:i + 2], 16) for i in (1, 3, 5)). أما في CSS فلا حاجة إلى التحويل – فكلتا الصيغتين مقبولة.
أيهما أفضل في CSS: hex أم RGB؟
كلاهما يصف الألوان نفسها تمامًا. صيغة hex أقصر وشائعة في أدوات التصميم؛ أما rgb() فأسهل في القراءة والتعديل، وتجعل الشفافية واضحة مع rgba(). كما تقبل المتصفحات الحديثة أكواد hex المكوّنة من 8 أرقام مع قناة ألفا.