محول الألوان

ما هو محول الألوان؟

محول الألوان هو أداة عبر الإنترنت تساعد المطورين على التحويل بين تنسيقات الألوان المختلفة. تشمل تنسيقات الألوان الأكثر شيوعًا في تطوير الويب HEX (ست عشري) وRGB (أحمر، أخضر، أزرق) وHSL (صبغة، تشبع، إضاءة) وCMYK (سماوي، أرجواني، أصفر، أسود للطباعة). تدعم هذه الأداة الاكتشاف التلقائي لتنسيق الإدخال وإخراج التنسيقات الأربعة جميعها في آن واحد، مما يحسّن كفاءة اختيار الألوان بشكل كبير.

دليل تنسيقات الألوان

• HEX — رمز لوني ست عشري، يبدأ بالرمز #، مثل #ff6600. وهو التنسيق اللوني الأكثر استخدامًا في CSS.
• RGB — تمثيل الألوان بالأحمر والأخضر والأزرق، مثل rgb(255, 102, 0). يتراوح كل مكوّن بين 0 و255.
• HSL — الصبغة (Hue 0~360°) والتشبع (Saturation 0~100%) والإضاءة (Lightness 0~100%). وهو نموذج الألوان الأكثر توافقًا مع الحدس البشري.
• CMYK — سماوي (Cyan) وأرجواني (Magenta) وأصفر (Yellow) وأسود (Key). وهو التنسيق القياسي في صناعة الطباعة.
• ألوان CSS المسماة — أكثر من 140 اسم لون معرّف من قبل W3C، مثل rebeccapurple وcoral.

حالات الاستخدام الشائعة

• تصميم واجهات المستخدم — يقدّم المصمم قيمة HEX، ويحتاج المطور إلى HSL لضبط الإضاءة
• حالات الأزرار — استخدم Tints & Shades لتوليد تدرجات حالات التمرير (hover) والتفعيل (active)
• ألوان العلامة التجارية — استخدم أنظمة الألوان لتوليد الألوان المتكاملة والثلاثية
• فحص إمكانية الوصول — استخدم فاحص تباين WCAG لضمان قابلية قراءة النص
• تدرجات CSS — استخدم المفضلة لتجهيز الألوان لتوليد التدرجات لاحقًا

معايير التباين WCAG

• معيار AA — النص العادي ≥ 4.5:1، النص الكبير ≥ 3:1
• معيار AAA — النص العادي ≥ 7:1، النص الكبير ≥ 4.5:1