CSS Gradient Generator
Build linear, radial and conic gradients and copy the CSS.
تصميم
تحويل بين HEX وRGB وHSL وHSV وCMYK وOKLCH.
كلها تصف الألوان نفسها، ولا تصلح كلها للغرض نفسه.
| الصيغة | مناسبة لـ | ضعفها |
|---|---|---|
| HEX | كتابة مختصرة مقروءة في كل مكان | لا تدلّ على شيء بالنظر |
| RGB | الحساب البرمجي والشفافية | القيم لا تصف الانطباع |
| HSL | إزاحة درجة اللون سريعًا | الإضاءة لا تطابق الإدراك |
| CMYK | ما قبل الطباعة | تعتمد على الجهاز والملف اللوني |
| LAB | قياس الفروق اللونية | قيم يصعب تصوّرها |
| OKLCH | تدرّجات متساوية وأنظمة تصميم | المتصفحات القديمة لا تعرفها |
ولمشاريع الويب صارت OKLCH الخيار الأفضل حيث لا يشكّل دعم المتصفحات عائقًا: الخطوة الرقمية المتساوية تعطي خطوة بصرية متساوية، وهو ما لا يتحقّق في HSL.
لأن لونين بالقيمة نفسها للإضاءة في HSL يبدوان مختلفَي السطوع بوضوح.
فالأصفر الخالص والأزرق الخالص كلاهما عند إضاءة 50%. وعلى الشاشة يبدو الأصفر أسطع بكثير، لأن العين أشدّ حساسية للأخضر والأصفر منها للأزرق.
وأثر ذلك عمليًا لوحات ألوان تبدو منتظمة على الورق وغير متّسقة في التطبيق: لون التحذير الأصفر يصرخ، ولون المعلومة الأزرق يكاد يختفي.
وOKLCH يعالج ذلك لأن محور الإضاءة فيه مبني على الإدراك. فاللوحة ذات الإضاءة الثابتة تبدو متساوية السطوع عبر كل درجات اللون — وهو ما يحتاجه أي نظام تصميم.
لأن RGB وCMYK فضاءان مختلفان لا يتطابق مداهما.
فRGB يمزج الضوء ويستطيع إنتاج ألوان لا يمكن لأي طباعة تحقيقها — سماوي متوهّج وبرتقالي مشبع. وCMYK يمزج الأصباغ وله حدوده في مواضع أخرى.
والتحويل بلا ملف لوني تقريب دائمًا. وللطباعة الملف اللوني للعملية هو الفيصل، وتحدّده المطبعة.
والقيم هنا تحويل قياسي بلا ملف. وللتسليم إلى مطبعة أنتج بيانات CMYK من برنامج التصميم بالملف الذي تطلبه المطبعة، لا من محوّل.
كل خانتين رقم ست عشري. فـ#4A90D9 تعطي rgb(74, 144, 217).
فضاء لوني مبني على الإدراك. الخطوة الرقمية المتساوية فيه تعطي خطوة بصرية متساوية، بخلاف HSL.
لأن إضاءة HSL لا تطابق الإدراك. الأصفر عند 50% يبدو أسطع من الأزرق عند 50%.
الأفضل لا. بلا ملف لوني يبقى التحويل تقريبيًا. استخدم الملف الذي تطلبه المطبعة.
بصيغة HEX من ثماني خانات، أو rgba، أو بشرطة مائلة في الصيغ الحديثة.
لا. كل الحساب في هذه الصفحة.