كيفية تحديد اللون التكميلي للون المعطى

الهدف هو إنشاء لون عكس لون معين. على سبيل المثال ، إذا كان اللون الحالي أسود ، فيجب أن يكون العكس أبيض. هذه المهمة أمر بالغ الأهمية عند تعيين لون خلفية متناقض لنص بلون ديناميكي لضمان رؤية واضحة.

لتحقيق ذلك ، نستخدم النهج التالي:

لون للحصول على القيم التكميلية.

1. تحويل المكونات المقلوبة مرة أخرى إلى تنسيق hex. if (hex.indexof ('#') === 0) { Hex = hex.slice (1) ؛ } // تحويل 3 أرقام Hex إلى 6 أرقام. if (hex.length === 3) { Hex = Hex [0] Hex [0] Hex [1] Hex [1] Hex [2] hex [2] ؛ } if (hex.length! == 6) { رمي خطأ جديد ("لون سداسي غير صالح.") ؛ } // عكس مكونات اللون. var r = (255 - parseint (hex.slice (0 ، 2) ، 16)). tostring (16) ، g = (255 - parseint (hex.slice (2 ، 4) ، 16)). tostring (16) ، B = (255 - parseint (hex.slice (4 ، 6) ، 16)). tostring (16) ؛ // PAD كل مكون مع الأصفار الرائدة والعودة. إرجاع '#' padzero (r) padzero (g) padzero (b) ؛ } وظيفة padzero (str ، len) { لين = لين || 2 ؛ var zeros = new array (len). join ('0') ؛ العودة (الأصفار str) .slice (-len) ؛ }
2. مثال على الإخراج:
يتيح لك خيار "BW" لتحديد ما إذا كان يجب أن تكون النتيجة أقرب إلى الأسود أو الأبيض ، مما يوفر تباينًا أفضل لتحسين القراءة:

if (hex.indexof ('#') === 0) { Hex = hex.slice (1) ؛ } // تحويل 3 أرقام Hex إلى 6 أرقام. if (hex.length === 3) { Hex = Hex [0] Hex [0] Hex [1] Hex [1] Hex [2] hex [2] ؛ } if (hex.length! == 6) { رمي خطأ جديد ("لون سداسي غير صالح.") ؛ } var r = parseint (hex.slice (0 ، 2) ، 16) ، g = parseint (hex.slice (2 ، 4) ، 16) ، B = parseint (hex.slice (4 ، 6) ، 16) ؛ إذا (bw) { // الصيغة لتحديد ما إذا كان اللون أقرب إلى الأسود أو الأبيض. العودة (r * 0.299 g * 0.587 b * 0.114)> 186 ؟ '#000000' : '#ffffff' ؛ } // عكس مكونات اللون. r = (255 - r) .ToString (16) ؛ G = (255 - G) .ToString (16) ؛ B = (255 - B) .ToString (16) ؛ // PAD كل مكون مع الأصفار الرائدة والعودة. إرجاع '#' padzero (r) padzero (g) padzero (b) ؛ }

مثال على الإخراج: