منتقي ومحول كود الألوان

اختر لوناً أو أدخل كود HEX — احصل فوراً على HEX وRGB وHSL واسم CSS واللون التكميلي.

نتيجة فورية يعمل في المتصفح
كود HEX
#3D7EF7
قيمة RGB
rgb(61, 126, 247)
قيمة HSL
hsl(218, 91%, 60%)
اسم CSS
—
اللون التكميلي
#F7823D

نماذج الألوان

HEX  → #RRGGBB
RGB  → 0–255 per ch.
HSL  → 0–360° / 0–100%
WCAG → min 4.5:1

HEX: معيار الويب. RGB: قائم على الشاشة. HSL: تدرج-تشبع-إضاءة، بديهي للمصممين.

كيفية الاستخدام؟

  1. 1
    اختر اللونانقر على منتقي الألوان أو أدخل كود HEX مباشرة (مثال: #FF5733).
  2. 2
    اطّلع على القيميُحسب HEX وRGB وHSL فوراً؛ اسم CSS واللون التكميلي يظهران تلقائياً.
  3. 3
    نسخانسخ كود اللون المطلوب إلى الحافظة بنقرة واحدة.

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

ما هو كود اللون HEX؟
قيمة سداسية عشرية مكونة من 6 أرقام بتنسيق #RRGGBB. كل زوج يمثل شدة قناة لون (أحمر، أخضر، أزرق) من 00 إلى FF (0–255)، مما يتيح 16,777,216 لوناً.
RGB أم HSL — أيهما أستخدم؟
RGB يتوافق مع أجهزة الشاشة وشائع في CSS. HSL أكثر بداهة للمصممين: تغيير السطوع دون فقدان درجة اللون. كلاهما مدعوم بالكامل في CSS الحديث.
ما فائدة اللون التكميلي؟
اللون التكميلي يقع على بُعد 180° في دائرة الألوان ويخلق أقصى تباين — مثالي لأزرار الدعوة للعمل وعروض البيانات.

أكواد الألوان في الويب: HEX وRGB وHSL

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

أكواد ألوان HEX

HEX هو أشيع تنسيق للألوان في الويب. يُكتب كـ #RRGGBB حيث يشير كل زوج إلى شدة قناة (أحمر، أخضر، أزرق) من 00 إلى FF (0–255). بـ 256 قيمة لكل قناة، يدعم HEX 16,777,216 لوناً. الاختصار ثلاثي الأرقام #RGB صالح أيضاً.

نموذج ألوان RGB

يعكس RGB البنية المادية للشاشات. كل قناة تأخذ قيماً من 0 إلى 255. في CSS: rgb(255, 87, 51) أو مع الشفافية rgba(255, 87, 51, 0.8).

نموذج ألوان HSL

HSL (تدرج-تشبع-إضاءة) أكثر بداهة للمصممين. التدرج: 0–360° على دائرة الألوان. التشبع: 0%=رمادي، 100%=لون نابض. الإضاءة: 0%=أسود، 50%=طبيعي، 100%=أبيض.

الألوان التكميلية

الألوان التكميلية تقع على بُعد 180° من بعضها: أحمر ↔ سماوي، أخضر ↔ أرجواني، أزرق ↔ أصفر. تخلق أقصى تباين لأزرار CTA وتمثيل البيانات.

إمكانية الوصول (WCAG)

نحو 8% من الرجال يعانون من عمى الألوان. يشترط WCAG 2.1 AA نسبة تباين لا تقل عن 4.5:1 للنص العادي. لا تنقل المعلومات بالألوان وحدها.

الخصوصية

تتم جميع الحسابات محلياً في متصفحك. لا تُرسل أي بيانات إلى خوادم.

التعليقات