Skip to main content

مُحَوِّل RGB إلى HSL قم بتحويل قيم RGB إلى تنسيق لون HSL باستخدام شريحة تفاعلية.

مُحَوِّل RGB إلى HSL illustration
🎨

مُحَوِّل RGB إلى HSL

قم بتحويل قيم RGB إلى تنسيق لون HSL باستخدام شريحة تفاعلية.

1

ضبط قيم RGB

تعديل مشغلات الأحمر والأخضر والأزرق أو إدخال القيم من 0 إلى 255.

2

عرض إخراج HSL

رؤية قيم اللون والتشبع والضوء المحسوبة في الوقت الفعلي.

3

نسخ قيم HSL

نسخ سلسلة CSS hsl() للاستخدام المباشر في أوراق الأنماط الخاصة بك.

Loading tool...

What Is مُحَوِّل RGB إلى HSL?

مُحَوِّل RGB إلى HSL يُغيّر قيم قنوات اللون الأحمر والأخضر والأزرق إلى نموذج لونية يتكون من الإشارة والتشبع والضوء. هذه التحويل تربط بين طريقتين أساسيتين لوصف الألوان: RGB، وهي طريقة كيفية توليد الشاشات للألوان عن طريق مزيج الضوء، وHSL، والتي هي كيفية تصور البشر الطبيعية ووصف الألوان. عندما يقول المصمم "اجعل هذا الزرق أفتح قليلاً"، فهو يفكر بالفعل في مصطلحات HSL - احتفظ بالإشارة، احتفظ بالتشبع، زد الضوء. هذا الأداة تقوم بذلك الترجمة على الفور، مما يجعل من الأسهل العمل مع الألوان بطريقة أكثر直觉ية. المحول ضروري لأي تدفق عمل يبدأ بقيم RGB دقيقة (من أدوات اختيار الألوان أو واجهات برمجة التطبيقات أو تحليل الصور) ويحتاج إلى تعديل الألوان بشكل مفهومي. إنه ينتج تنسيق CSS هسل() قياسي يعمل في جميع المتصفحات الحديثة.

Why Use مُحَوِّل RGB إلى HSL?

  • مشغلات الألوان المرمزة تجعل من السهل تصور كل قناة RGB بشكل مستقل
  • إخراج HSL يساعدك على فهم الجودة الحسية لأي لون RGB
  • تحويل في الوقت الفعلي بدون تأخير أثناء تعديل القيم
  • إخراج hsl() جاهز للCSS للاستخدام الفوري في تطوير الويب
  • يساعد على سد الفجوة بين RGB التقني وتحسين الألوان التفاعلية

Common Use Cases

تحليل الألوان

فهم الخواص الحسية لأي لون RGB من خلال رؤية زاوية اللون ومستوى التشبع ودرجة الضوء.

إنشاء لوحة الألوان

تحويل الألوان الأساسية إلى HSL ثم تغيير بعد واحد بشكل منهجي لإنشاء لوحات ملونة متناسقة.

التحكم الديناميكي في التصميم

تحويل ألوان العلامة التجارية RGB إلى HSL لنظام متغيرات CSS يدعم تبديل السمات في وقت التشغيل.

تعليم الألوان

تعلم كيفية تعيين قيم RGB على خواص اللون والتشبع والضوء التي يمكن للبشر ملاحظتها.

Technical Guide

خوارزمية RGB إلى HSL تُعيِّن قيم R وG وB من 0-255 إلى نطاق 0-1، ثم تحدد القيمة القصوى والقيمة الدنيا للقناة. الضوء هو المتوسط الحسابي للقيمة القصوى والدنيا: L = (max + min) / 2. للألوان غير الملوّنة (القيمة القصوى = القيمة الدنيا)، الإشارة والتشبع كلاهما يساويان 0. للألوان الملونة، التشبع = دلتا / (1 - |2L - 1|) حيث دلتا = القيمة القصوى - القيمة الدنيا. حساب الإشارة يعتمد على أي قناة هي القيمة القصوى: القيمة القصوى هي R → H = (G-B)/دلتا mod 6؛ القيمة القصوى هي G → H = (B-R)/دلتا + 2؛ القيمة القصوى هي B → H = (R-G)/دلتا + 4. اضرب في 60 للحصول على الدرجات. يتم تعديل قيم الإشارة السلبية بإضافة 360. تقوم قيم HSL الناتجة بوصف نفس اللون في نظام إحداثي أسطواني. الفكرة الرئيسية: لونان لهما نفس الإشارة والتشبع ولكن الضوء المختلف سيكونان يشبهان درجتين طبيعتين من بعضهما البعض. هذه الخاصية تجعل HSL مثالية لتوليد مقاييس الألوان، وهي مهمة صعبة القيام بها بشكل صحيح في مجال RGB.

Tips & Best Practices

  • 1
    القيم المتساوية ل R و G و B دائمًا ما تنتج hue=0، saturation=0 (ألوان رمادية نقية)
  • 2
    التشبع العالي + 50٪ من الضوء ينتج الإصدار الأكثر إشراقاً لأي لون
  • 3
    HSL أفضل من RGB لإنشاء سلاسل ألوان ورموز تصميم متسقة
  • 4
    استخدم هذا التحويل للكشف عن ما إذا كان اللون دافئًا (H: 0-60° أو 300-360°) أو بارداً (H: 120-240°)
  • 5
    دعم CSS hsl() واسع النطاق وغالبًا ما يفضل على rgb() لإنشاء أوراق أنماط قابلة للصيانة

Related Tools

Frequently Asked Questions

Q لماذا نتحول من RGB إلى HSL؟
HSL يصف الألوان بالشروط التي يفهمها البشر: ما هو اللون (اللون)، كيف يكون متوهجاً (التشبع)، وكيف يكون明عًا (الضوء). هذا يجعل تحسين الألوان أكثر直ورًا من تعديل قنوات R و G و B.
Q هل التحويل بدون خسارة؟
يحافظ التحويل على جميع المعلومات اللونية. يمكنك تحويل RGB → HSL → RGB والحصول على القيم الأصلية (مع تدوير صغير محتمل).
Q ماذا يعني لون 0؟
اللون 0° (و 360°) يمثل اللون الأحمر. دوائر الألوان هي: أحمر(0°) → أصفر(60°) → أخضر(120°) → سيان(180°) → أزرق(240°) → ماجنتا(300°) → أحمر(360°).
Q كيف أجعل اللون أكثر خمولًا باستخدام HSL؟
تقليل قيمة التشبع. تشبع 100٪ هو لون متوهج بالكامل، بينما تنتج القيم الأدنى ألوان باهتة ومائلة للرمادي. عند 0٪ تشبع، تحصل على لون رمادي نقي.
Q ما العلاقة بين الضوء والسطوع؟
في HSL، الضوء 0٪ دائمًا ما يكون أسوداً، و 100٪ هو أبيض دائماً، و 50٪ يمثل الشكل النقي للون. هذا يختلف عن السطوع / القيمة في HSV حيث تكون 100٪ هي اللون النقي.

About This Tool

مُحَوِّل RGB إلى HSL is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.