محول SwiftUI إلى HSL

الصق قيمة SwiftUI واحصل على HSL فورًا. أي صيغة أخرى تعمل أيضًا.

من SwiftUI

فُهم على أنه كود Swift

قيمة HSLhsl(10.58, 100%, 60%)

HSL إلى SwiftUI

ضبط اللون

الصبغة11 درجة

الشفافية100‎%‎

الإضاءة68‎%‎

الكروما0.210

الصبغة34 درجة

كل الصيغ الأخرى

أمثلة تحويل SwiftUI إلى HSL

اللون	SwiftUI	HSL
	Color(red: 1, green: 0, blue: 0)	hsl(0, 100%, 50%)
	Color(red: 0, green: 1, blue: 0)	hsl(120, 100%, 50%)
	Color(red: 0, green: 0, blue: 1)	hsl(240, 100%, 50%)
	Color(red: 1, green: 1, blue: 1)	hsl(0, 0%, 100%)
	Color(red: 0, green: 0, blue: 0)	hsl(0, 0%, 0%)
	Color(red: 0.502, green: 0.502, blue: 0.502)	hsl(0, 0%, 50.2%)
	Color(red: 1, green: 0.341, blue: 0.2)	hsl(10.59, 100%, 60%)
	Color(red: 0.231, green: 0.51, blue: 0.965)	hsl(217.22, 91.22%, 59.8%)
	Color(red: 0.063, green: 0.725, blue: 0.506)	hsl(160.12, 84.08%, 39.41%)
	Color(red: 0.961, green: 0.62, blue: 0.043)	hsl(37.69, 92.13%, 50.2%)
	Color(red: 0.545, green: 0.361, blue: 0.965)	hsl(258.31, 89.53%, 66.27%)
	Color(red: 0.925, green: 0.282, blue: 0.6)	hsl(330.37, 81.19%, 60.39%)

عن SwiftUI وHSL

يصف SwiftUI اللون بقيم الأحمر والأخضر والأزرق من 0 إلى 1، ويُكتب هكذا Color(red: 1, green: 0.341, blue: 0.2). وتُضاف العتامة بالمعامل opacity.

تصف صيغة HSL الصبغة بالدرجات، والتشبع والإضاءة بالنسبة المئوية. قراءتها سهلة، لكن إضاءتها غير متساوية إدراكيًا: الأصفر عند 50% يبدو أفتح بكثير من الأزرق عند 50%.

كيف يعمل التحويل

نقرأ قيمة SwiftUI ونحوّلها إلى CIE XYZ بالمصفوفات الواردة في مواصفة CSS Color 4، ثم إلى HSL. القيم الخارجة عن النطاق اللوني الهدف تُعالَج بخوارزمية CSS Color 4 التي تحافظ على الإضاءة والصبغة وتخفّض الكروما.

أسئلة وأجوبة

كيف أحوّل SwiftUI إلى HSL؟

الصق قيمة SwiftUI أو اكتبها في الحقل أعلاه. يحوّلها PickShade بمعادلات CSS Color 4 أثناء الكتابة، ونقرة واحدة تنسخ قيمة HSL.

هل تحويل SwiftUI إلى HSL دقيق؟

الحسابات دقيقة، والنتيجة تُقرَّب للعرض فقط، مع عدد كافٍ من الأرقام للعودة إلى اللون نفسه. وإذا لم يقع اللون ضمن النطاق الهدف، ينبّهك PickShade ويعرض أقرب لون يقع ضمنه.

هل يمكنني الحصول على صيغ أخرى في الوقت نفسه؟

نعم. كل الصيغ الأخرى، ومنها OKLCH وDisplay P3 وTailwind وSwiftUI وFlutter وAndroid، مدرجة أسفل النتيجة وتُنسخ بنقرة واحدة.

هل هذا المحول مجاني؟

نعم. مجاني، ولا يحتاج إلى تسجيل، ويعمل بالكامل في متصفحك.