محول HEX إلى RGB
تحويل أكواد ألوان HEX إلى قيم RGB.
محول HEX إلى RGB
جاهزمحوّل HEX إلى RGB أونلاين — تحويل أكواد HEX إلى RGB مجاناً
محوّل HEX إلى RGB من Toolsiro يُحوِّل أي كود لون سداسي عشري إلى قيم RGB فوراً — مع معاينة لونية مباشرة ومنزلقات تعرض كل قناة ومخرجات بتنسيقات متعددة. اكتب أو الصق كود HEX، أو اختر لوناً بصرياً، وتتحدث جميع التنسيقات في الوقت الفعلي.
HEX وRGB أكثر تنسيقَي الألوان شيوعاً في تطوير الويب. معرفة التحويل بينهما — وفهم ما تعنيه القيم — تجعلك أسرع وأكثر دقة وثقةً عند العمل مع الألوان في الكود وأدوات التصميم.
كيف يعمل تحويل HEX إلى RGB
كود اللون السداسي العشري تمثيل مدمج لثلاث قيم قنوات RGB. بادئة # مجرد علامة — البيانات الفعلية هي الأرقام السداسية الستة التالية، مُقسَّمة إلى ثلاثة أزواج. كل زوج يُمثِّل قناة واحدة: الرقمان الأولان للأحمر، الوسطان للأخضر، الأخيران للأزرق.
تحويل كل زوج من السداسية العشرية إلى عشري يعطي قيمة RGB. في السداسية العشرية، الأرقام 0–9 لها قيمها العادية، وA–F تُمثِّل 10–15. مثلاً: #6366F1 تنقسم إلى 63 (أحمر)، 66 (أخضر)، F1 (أزرق). 63 سداسي = (6 × 16) + 3 = 99. 66 سداسي = (6 × 16) + 6 = 102. F1 سداسي = (15 × 16) + 1 = 241. النتيجة: RGB(99, 102, 241).
قراءة أكواد HEX
مع الممارسة، يمكنك تعلم قراءة ألوان HEX بنظرة دون تحويل. #FF0000 أحمر خالص. #00FF00 أخضر خالص. #0000FF أزرق خالص. #FFFFFF أبيض. #000000 أسود. #808080 رمادي متوسط.
عندما تكون الأزواج الثلاثة بنفس القيمة، يكون اللون دائماً رمادياً محايداً عند مستوى السطوع ذاك — #333333 رمادي داكن، #AAAAAA رمادي فاتح، #EEEEEE رمادي فاتح جداً. عندما يكون زوج واحد أعلى بكثير من الآخرين، تلك القناة تسود ويميل اللون نحو لونها الأساسي. #FF8800 له أحمر أقصى وأخضر متوسط وبلا أزرق — ينتج البرتقالي.
اختصار HEX بثلاثة أرقام
أكواد HEX بثلاثة أرقام اختصار صالح لأكواد 6 أرقام حيث كل زوج مكون من رقمين متطابقَين. #FFF يتوسع إلى #FFFFFF (أبيض). #000 إلى #000000 (أسود). #F00 إلى #FF0000 (أحمر). التحويل متطابق — كل رقم يتضاعف فقط لتشكيل الزوج ذي الرقمين. تقبل الأداة مدخلات بثلاثة أرقام وتوسِّعها تلقائياً قبل التحويل.
HEX بثمانية أرقام مع ألفا
تدعم CSS الحديثة أكواد HEX بثمانية أرقام تتضمن قناة ألفا (الشفافية) كرقمَين أخيرَين. #6366F180 يعني اللون الأساسي بتعتيم حوالي 50% (80 سداسي = 128 عشري، نصف 255). #6366F1FF غير شفاف بالكامل. #6366F100 شفاف بالكامل.
ألوان HEX في CSS وHTML
تظهر أكواد HEX في جميع أنحاء CSS وHTML. في CSS، هي صالحة لأي خاصية لون: color: #6366F1; للنص، background-color: #F3F4F6; للخلفيات، border-color: #E5E7EB; للحدود. HEX غير حساس لحالة الأحرف — #6366f1 و#6366F1 متطابقَان.
متى تستخدم HEX مقابل RGB في CSS
كلاهما يصف نفس الألوان بنفس الدقة. استخدم HEX عندما يهم الترميز المدمج. استخدم rgb() عندما تحتاج شفافية (rgba()) أو عند معالجة قيم القنوات الفردية برمجياً.
خصائص CSS المخصصة (المتغيرات) كثيراً ما تخزن الألوان كقيم قنوات RGB فردية لتمكين حيلة شفافية rgba(): --color-primary: 99, 102, 241; متبوعاً بـbackground: rgba(var(--color-primary), 0.1); هذه التقنية تستلزم قيم RGB، مما يجعل تحويل HEX إلى RGB عملياً مباشرةً.
ألوان HEX في أدوات التصميم
كل أداة تصميم رئيسية تدعم مدخلات ومخرجات ألوان HEX. في Figma، يعرض منتقي الألوان حقل HEX حيث يمكنك الكتابة أو اللصق مباشرةً. عند نسخ الألوان بين ملف تصميم وكود CSS، HEX هو الصيغة الأقل احتكاكاً — الصقه مباشرةً من الأداة إلى ورقة الأنماط.
أسئلة شائعة
ما قيم RGB التي يُنتجها #FFFFFF؟ RGB(255, 255, 255) — أبيض خالص مع جميع القنوات عند الحد الأقصى.
كيف أُحوِّل HEX بثلاثة أرقام إلى RGB؟ وسِّع الكود بثلاثة أرقام إلى 6 أرقام أولاً بمضاعفة كل رقم (#ABC → #AABBCC)، ثم حوِّل كل زوج من السداسية إلى عشري.
ما معنى أن زوجَين من HEX متطابقَان؟ عندما تكون الأزواج الثلاثة متطابقة، يكون اللون رمادياً محايداً. عندما يكون زوجان متساويَين وواحد مختلفاً، يميل اللون نحو القناة الفريدة.
هل HEX يُمثِّل كل الألوان؟ يُمثِّل HEX القياسي بستة أرقام جميع 16,777,216 لون في فضاء ألوان RGB بـ8 بت لكل قناة. لا يمكنه تمثيل الألوان ذات النطاق الواسع المستخدمة في شاشات HDR التي تقع خارج فضاء sRGB.
هل هناك فرق بين HEX بالأحرف الصغيرة والكبيرة؟ لا — #6366f1 و#6366F1 متطابقَان. CSS غير حساس لحالة الأحرف في ألوان HEX. اختر اتفاقية واحدة لقاعدة الكود الخاصة بك.