ماذا تفعل الأداة
يأخذ محوّل الألوان لونًا بأي ترميز CSS شائع ويعرضه بكل الترميزات الأخرى دفعة واحدة: HEX وRGB وHSL وHSV وCMYK. كما يعرض عيّنة معاينة، واسم لون CSS عند وجود تطابق تام، ونسبة التباين مع الأبيض والأسود لتتحقق من سهولة القراءة.
طريقة الاستخدام
- اكتب لونًا أو الصقه في مربع اللون، أو استخدم منتقي الألوان بجانبه.
- تتحدّث جميع الترميزات أثناء الكتابة. انقر نسخ بجانب ما تحتاجه.
- فعّل HEX بأحرف كبيرة إذا كان دليل الأسلوب لديك يكتب HEX بأحرف كبيرة.
- راجع صفوف التباين قبل استخدام اللون للنصوص: الشارة الخضراء تعني أنه يجتاز معيار WCAG AA.
مثال
#1e90ff هو لون CSS المسمّى dodgerblue. ويُحوَّل إلى:
- RGB:
rgb(30, 144, 255) - HSL:
hsl(210, 100%, 55.9%) - HSV:
hsv(210, 88.2%, 100%) - CMYK:
cmyk(88%, 44%, 0%, 0%)
تباينه على الأبيض 3.24:1، وهو كافٍ للعناوين الكبيرة لكنه غير كافٍ لنص المحتوى.
نماذج الألوان باختصار
- HEX وRGB يصفان مقدار الضوء الأحمر والأخضر والأزرق الذي تبثّه الشاشة، وهما ما تستخدمه المتصفحات وأدوات التصميم داخليًا.
- HSL يصف درجة اللون (الزاوية على عجلة الألوان) والتشبّع والإضاءة، ما يسهّل إنشاء درجات أفتح أو أغمق من اللون نفسه.
- HSV (ويُسمّى أيضًا HSB) هو ما تستخدمه معظم منتقيات الألوان في برامج التصميم.
- CMYK يصف أحبار السماوي والأرجواني والأصفر والأسود في الطباعة.
تُعرض الألوان ذات الشفافية، مثل #1e90ff80 أو rgb(30 144 255 / 50%)، مع قناة ألفا في HEX وRGB وHSL.
الأسئلة الشائعة
› كيف أحوّل HEX إلى RGB؟
قسّم الأرقام الست الست عشرية إلى ثلاثة أزواج، واقرأ كل زوج كرقم من 0 إلى 255. في #1e90ff يكون 1e = 30 و90 = 144 وff = 255، أي rgb(30, 144, 255). وتقوم هذه الأداة بذلك نيابةً عنك أثناء الكتابة.
› ما الصيغ التي يمكنني لصقها؟
HEX مع # أو بدونه (3 أو 4 أو 6 أو 8 أرقام)، وrgb() وrgba()، وhsl() وhsla() بصيغة الفواصل أو المسافات، والنسب المئوية، ووحدات الزوايا مثل deg وturn، وجميع أسماء ألوان CSS البالغة 148 اسمًا.
› ماذا تعني نسبة التباين؟
هي نسبة التباين وفق WCAG 2 بين اللون وخلفية بيضاء أو سوداء. يحتاج نص المحتوى إلى 4.5:1 على الأقل لمستوى AA، ويحتاج النص الكبير (نحو 24px، أو 19px عريض) إلى 3:1.
› لماذا تكون قيمة CMYK تقريبية فقط؟
تستخدم الطابعات ملفات تعريف للحبر تعتمد على الورق وآلة الطباعة. وقيمة CMYK المعروضة هنا ناتجة عن المعادلة القياسية المستقلة عن الجهاز، وهي نقطة انطلاق جيدة لكنها لا تُغني عن ملف تعريف الطباعة.