أدوات تقنية

Color Picker

HEX, RGB, HSL

Color Picker
HEX, RGB, HSL
اختر لوناً
HEX
RGB
HSL
اسم اللون
جميع صيغ اللون — انقر للنسخ
درجات اللون
الألوان المتناسقة
مساحة إعلانية
عن الأداة

محوّل الألوان المتقدّم من Get-Tools — تحويل فوري بين HEX وRGB وHSL وCMYK وأكثر من ١٤ صيغة لونية

يُعدّ محوّل الألوان المتقدّم من Get-Tools واحداً من أقوى الأدوات المجانية المتاحة على الإنترنت لتحويل الألوان بين مختلف الصيغ المستخدمة في تصميم الويب، والتصميم الجرافيكي، وتطوير التطبيقات، والطباعة الاحترافية. صُمّمت هذه الأداة لتكون سريعة، ودقيقة، وسهلة الاستخدام، بحيث يمكنك الحصول على أي صيغة لونية تحتاجها بنقرة واحدة فقط. سواء كنت مصمّماً محترفاً يعمل على مشروع هوية بصرية، أو مطوّر ويب يحتاج لتحويل ألوان CSS، أو حتى هاوياً يستكشف عالم الألوان — فإن هذه الأداة مصنوعة خصيصاً لتلبية احتياجاتك.

الصيغ اللونية المدعومة — أكثر من ١٤ صيغة

تدعم الأداة تحويلاً فورياً بين جميع الصيغ اللونية الشائعة والمتخصصة:

  • HEX (#rrggbb): الصيغة الأكثر انتشاراً في تطوير الويب وCSS، مثل #4f46e5 أو الصيغة المختصرة #FFF. تُستخدم في جميع أنظمة إدارة المحتوى وأدوات التصميم الرقمي.
  • RGB و RGBA: تمثيل اللون بقيم الأحمر والأخضر والأزرق من ٠ إلى ٢٥٥. صيغة RGBA تُضيف قناة الشفافية (Alpha) وهي ضرورية للتصاميم الشفافة والتراكبات.
  • HSL و HSLA: درجة اللون (Hue ٠-٣٦٠ درجة) والتشبع والإضاءة. تتميّز هذه الصيغة بأنها الأسهل للتعديل اليدوي لأنها تحاكي طريقة تفكير المصممين في الألوان.
  • HSV / HSB: الصيغة المعتمدة في Adobe Photoshop وFigma وSketch وغيرها من برامج التصميم الاحترافية. إذا كنت تعمل بالتصميم الرقمي، فهذه الصيغة أساسية لك.
  • CMYK: صيغة الطباعة الاحترافية (سماوي، أرجواني، أصفر، أسود). لا غنى عنها عند إعداد ملفات للطباعة التجارية والمطابع.
  • CIE Lab: نموذج لوني يحاكي رؤية العين البشرية بدقة عالية، يُستخدم في بروفات الألوان الاحترافية وضبط الألوان في التصوير الفوتوغرافي.
  • CSS Named Colors: الأسماء المعرَّفة في مواصفات CSS مثل indigo وcoral وtomato.
  • Decimal: القيمة العددية الصحيحة للون، تُستخدم في Canvas API ومحركات الألعاب.
  • Android Color: صيغة 0xFF لتطوير تطبيقات أندرويد بلغة Java أو Kotlin.
  • Swift / iOS UIColor: صيغة UIColor لتطوير تطبيقات آيفون وآيباد.
  • CSS Filter: قيمة filter المُستخدمة لتلوين عناصر SVG عبر CSS.
  • Tailwind CSS: أقرب لون من نظام ألوان مكتبة Tailwind CSS الشهيرة.

الألوان المتناسقة — تطبيق عملي لنظرية الألوان

تعتمد الأداة على دائرة الألوان (Color Wheel) لاقتراح خمسة أنماط احترافية من التناسقات اللونية. فهم هذه التناسقات يُعدّ أساساً في التصميم الجرافيكي وتصميم واجهات المستخدم:

  • متكاملة (Complementary): اللون المقابل تماماً في الدائرة (بزاوية ١٨٠ درجة). يُنتج أقوى تباين بصري ويُستخدم في التصاميم الجريئة التي تحتاج إلى لفت الانتباه.
  • ثلاثية (Triadic): ثلاثة ألوان متباعدة بزاوية ١٢٠ درجة على الدائرة. يوفر توازناً بصرياً مع حيوية عالية، وهو خيار ممتاز للعلامات التجارية التي تريد هوية ملونة وحيوية.
  • متجاورة (Analogous): ألوان متجاورة على الدائرة. تُنتج تصاميم ناعمة ومريحة للعين، وهي شائعة في تصاميم الطبيعة والمواقع الهادئة.
  • متكاملة منقسمة (Split Complementary): اللون مع جارَي لونه المكمّل. توفر تبايناً جذاباً أقل حدّةً من المتكاملة البسيطة.
  • رباعية (Tetradic): أربعة ألوان تشكّل مستطيلاً على الدائرة. أغنى وأكثر تعقيداً، وتتطلب توازناً دقيقاً لتجنّب الفوضى البصرية.

درجات اللون — من الفاتح إلى الغامق

تعرض الأداة ١٨ درجة متدرّجة للون المختار، من الأفتح إلى الأغمق. كل درجة قابلة للنقر لتحويلها فوراً إلى جميع الصيغ. هذه الميزة مثالية لبناء أنظمة ألوان متناسقة (Design Tokens) في مشاريع التصميم، حيث تحتاج إلى درجات متعددة من اللون الأساسي للأزرار والخلفيات والنصوص.

من يستخدم هذه الأداة؟

  • مطورو الويب: تحويل سريع بين HEX وRGB وHSL أثناء كتابة كود CSS وJavaScript وSass.
  • المصممون الجرافيكيون: تحويل ألوان Photoshop وFigma (بصيغة HSB) إلى CMYK للطباعة أو HEX للويب.
  • مطورو التطبيقات: الحصول على صيغة UIColor لنظام iOS أو صيغة 0xFF لنظام Android مباشرة.
  • مصممو الهوية البصرية: اختيار تناسقات لونية احترافية لبناء دليل ألوان العلامة التجارية.
  • صنّاع المحتوى: إيجاد ألوان متناسقة لتصاميم منشورات السوشيال ميديا والعروض التقديمية.
  • الطلاب والمعلمون: تعلّم نظرية الألوان بشكل تفاعلي من خلال مشاهدة التناسقات والتدرجات اللونية مباشرة.

الخصوصية والأمان

تعمل الأداة بالكامل داخل متصفحك. لا يتم إرسال أي بيانات إلى خوادم خارجية، ولا يتم تخزين أي معلومات عن الألوان التي تختارها. جميع العمليات الحسابية تتم محلياً باستخدام JavaScript، مما يضمن سرعة فائقة وخصوصية تامة.

مزايا إضافية

  • منتقي ألوان أصلي (Native Color Picker) لاختيار أي لون من شاشتك.
  • نسخ أي قيمة لونية بنقرة واحدة إلى الحافظة.
  • زر اللون العشوائي لاستكشاف ألوان جديدة وإلهام إبداعي.
  • التعرّف التلقائي على أقرب اسم CSS للون المختار.
  • واجهة متجاوبة تعمل على جميع الأجهزة — الحاسوب والجوال والأجهزة اللوحية.
مساحة إعلانية