เมื่อคุณพูดถึงคุณมีพื้นหลังนิ่งสีของลูกบอลยังคงเป็นแบบสุ่ม แต่พวกเขาจะต้องตกอยู่ในบางช่วงที่ยังคงชมพื้นหลัง
ข้อมูลพื้นฐานเกี่ยวกับ ก่อนที่เราจะทำอย่างนั้นคุณจำเป็นต้องรู้พื้นฐาน พิจารณาสีต่อไปนี้:
Black #000000 rgb(0,0,0)
Red #FF0000 rgb(255,0,0)
Green #00FF00 rgb(0,255,0)
Blue #0000FF rgb(0,0,255)
Yellow #FFFF00 rgb(255,255,0)
Cyan #00FFFF rgb(0,255,255)
Pink #FF00FF rgb(255,0,255)
Gray #C0C0C0 rgb(192,192,192)
White #FFFFFF rgb(255,255,255)
การผสมสี RGB [(0..255), (0..255), (0..255)] สร้างสีใหม่ดังกล่าวข้างต้น
การคำนวณเพื่อลบสีการคำนวณเพื่อลบสีก็เหมือนกับการเปลี่ยนสีแดงเป็นสีฟ้าสีเขียวสีม่วงสีม่วงสีน้ำเงินสีเหลือง
Red #FF0000 rgb(255,0,0) -> Cyan #00FFFF rgb(0,255,255)
Green #00FF00 rgb(0,255,0) -> Purple #FF00FF rgb(255,0,255)
Blue #0000FF rgb(0,0,255) -> Yellow #FFFF00 rgb(255,255,0)
สีเสริม
ตามการอ้างอิงเกี่ยวกับการคำนวณสีเสริม: http://serennu.com/colour/rgbtohsl.php
เกี่ยวกับ HSL
HSL เป็นการแสดงออกถึงสีในแง่ของสีสันความอิ่มตัวและความสว่างของพวกเขาซึ่งเป็นตัวเลขสำหรับคุณลักษณะทั้งสามของสีเหล่านี้
ฮิวคือตำแหน่งสีของวงล้อสีซึ่งแสดงเป็นองศาตั้งแต่ 0 °ถึง 359 °หรือคิดเป็น 360 องศาของวงล้อ 0 °เป็นสีแดง 180 °เป็นสีฟ้าของสีแดงตรงกันข้ามเป็นต้น
ความอิ่มตัวของสีคือความเข้มของสีว่ามันน่าเบื่อหรือสว่างแค่ไหน ความอิ่มตัวของสียิ่งต่ำ นี่แสดงเป็นเปอร์เซ็นต์, 100% เป็นความอิ่มตัวเต็ม, สว่างที่สุดและ 0% ไม่มีความอิ่มตัว, สีเทา
ความสว่างคือความสว่างของสี แตกต่างกันเล็กน้อยเพื่อความอิ่มตัว ยิ่งสีขาวมีค่าความสว่างมากเท่าไหร่สีดำก็ยิ่งมีความสว่างมากขึ้นเท่านั้น ดังนั้นความสว่าง 100% เปลี่ยนสีขาว, 0% ความสว่างเปลี่ยนเป็นสีดำและสี "บริสุทธิ์" จะเป็น 50% ความสว่าง
การเห็นความแตกต่างระหว่าง Saturation และ Lightness ง่ายกว่าการอธิบาย หากคุณต้องการชี้แจงให้ลองดูรูปแบบความสว่างและความอิ่มตัวของสีบนหน้าเครื่องคิดเลขสีโดยเลือกสีที่สดใสเป็นสีเริ่มต้นของคุณ
ดังนั้นเครื่องหมาย HSL จะมีลักษณะเช่นนี้โดยให้ค่า Hue, Saturation และ Lightness ตามลำดับ: t
สีแดง: 0 ° 100% 50% สีชมพูอ่อน: 0 ° 100% 90% ฟ้า: 180 ° 100% 50% นี่คือขั้นตอน:
แปลงสีของคุณเป็น HSL
เปลี่ยนค่าฮิวเป็นค่าที่ตรงกันข้ามของฮิว (เช่นถ้าฮิวของคุณคือ 50 °ค่าที่ตรงกันข้ามจะอยู่ที่ 230 °บนวงล้อ - 180 องศาต่อไป)
ปล่อยให้ค่าความอิ่มตัวและความสว่างเท่าที่ควร
แปลงค่า HSL ใหม่นี้กลับไปเป็นรูปแบบสีดั้งเดิมของคุณ (RGB หรืออะไรก็ตาม)
ไซต์เช่น EasyRGB.com สามารถทำการแปลงทั่วไปสำหรับคุณจาก RGB เป็น HSL หรือในทางกลับกัน
ตัวอย่างการเขียนโปรแกรมทำใน PHP ตามการอ้างอิง
การแปลงจาก RGB เป็น HSL
ค่าดังกล่าวข้างต้นสีน้ำเงิน # 0000FF rgb (0,0,255) สามารถแสดงเป็นเลขฐานสิบหกสีแดง 00 + เลขฐานสิบหกสีเขียว 00 + เลขฐานสิบหกสีฟ้า FF
$redhex = substr($hexcode,0,2);
$greenhex = substr($hexcode,2,2);
$bluehex = substr($hexcode,4,2);
นอกจากนี้ยังสามารถนำเสนอเป็นสีแดงทศนิยม 0 + สีเขียวทศนิยม 0 + สีน้ำเงินทศนิยม 255
$var_r = (hexdec($redhex)) / 255;
$var_g = (hexdec($greenhex)) / 255;
$var_b = (hexdec($bluehex)) / 255;
ตอนนี้เสียบค่าเหล่านี้ลงในรูทีน rgb2hsl ด้านล่างนี้คือรหัสทั่วไปของ EasyRGB.com รุ่น PHP ของฉันสำหรับการแปลง:
ข้อมูลเข้าคือ $ var_r, $ var_g และ $ var_b จากด้านบนผลลัพธ์เป็น HSL เทียบเท่ากับ $ h, $ s และ $ l - สิ่งเหล่านี้จะแสดงเป็นเศษส่วน 1 เช่นค่าอินพุต
$var_min = min($var_r,$var_g,$var_b);ttt
$var_max = max($var_r,$var_g,$var_b);
$del_max = $var_max - $var_min;
$l = ($var_max + $var_min) / 2;
if ($del_max == 0)
{
$h = 0;
$s = 0;
}
else
{
if ($l < 0.5)
{
$s = $del_max / ($var_max + $var_min);
}
else
{
$s = $del_max / (2 - $var_max - $var_min);
};
$del_r = ((($var_max - $var_r) / 6) + ($del_max / 2)) / $del_max;
$del_g = ((($var_max - $var_g) / 6) + ($del_max / 2)) / $del_max;
$del_b = ((($var_max - $var_b) / 6) + ($del_max / 2)) / $del_max;
if ($var_r == $var_max)
{
$h = $del_b - $del_g;
}
elseif ($var_g == $var_max)
{
$h = (1 / 3) + $del_r - $del_b;
}
elseif ($var_b == $var_max)
{
$h = (2 / 3) + $del_g - $del_r;
};
if ($h < 0)
{
$h += 1;
};
if ($h > 1)
{
$h -= 1;
};
};
ตอนนี้เรามีสีเป็นค่า HSL ในตัวแปร $ h, $ s และ $ l ตัวแปรเอาต์พุตทั้งสามนี้ถูกจัดขึ้นอีกครั้งเป็นเศษส่วน 1 ในระยะนี้แทนที่จะเป็นองศาและเปอร์เซ็นต์ ดังนั้นเช่นสีฟ้า (180 ° 100% 50%) จะออกมาเป็น $ h = 0.5, $ s = 1, และ $ l = 0.5
จากนั้นหาค่าของสีตรงข้ามเช่นค่าที่อยู่ที่ 180 °หรือ 0.5 ห่างออกไป (ฉันแน่ใจว่านักคณิตศาสตร์มีวิธีที่สง่างามกว่าในเรื่องนี้ แต่):
คำนวณเว้ตรงข้าม, $ h2
$h2 = $h + 0.5;
if ($h2 > 1)
{
$h2 -= 1;
};
ตอนนี้ค่า HSL ของสีเสริมเป็น $ h2, $ s, $ l ดังนั้นเราพร้อมที่จะแปลงกลับเป็น RGB (อีกครั้งสูตร PHP EasyRGB.com ของฉัน) หมายเหตุรูปแบบอินพุตและเอาต์พุตต่างกันในเวลานี้โปรดดูความคิดเห็นของฉันที่ด้านบนของรหัส:
อินพุตคือค่า HSL ของสีเสริมจัดขึ้นใน $ h2, $ s, $ l เป็นเศษส่วนของ 1 เอาท์พุทคือ RGB ในรูปแบบปกติ 255 255 255 255 จัดขึ้นใน $ r, $ g, $ b เว้ถูกแปลงโดยใช้ฟังก์ชัน hue_2_rgb ในตอนท้ายของรหัสนี้
if ($s == 0)
{
$r = $l * 255;
$g = $l * 255;
$b = $l * 255;
}
else
{
if ($l < 0.5)
{
$var_2 = $l * (1 + $s);
}
elset
{
$var_2 = ($l + $s) - ($s * $l);
};
$var_1 = 2 * $l - $var_2;
$r = 255 * hue_2_rgb($var_1,$var_2,$h2 + (1 / 3));
$g = 255 * hue_2_rgb($var_1,$var_2,$h2);
$b = 255 * hue_2_rgb($var_1,$var_2,$h2 - (1 / 3));
};
// Function to convert hue to RGB, called from above
function hue_2_rgb($v1,$v2,$vh)
{
if ($vh < 0)
{
$vh += 1;
};
if ($vh > 1)
{
$vh -= 1;
};
if ((6 * $vh) < 1)
{
return ($v1 + ($v2 - $v1) * 6 * $vh);
};
if ((2 * $vh) < 1)
{
return ($v2);
};
if ((3 * $vh) < 2)
{
return ($v1 + ($v2 - $v1) * ((2 / 3 - $vh) * 6));
};
return ($v1);
};
และหลังจากรูทีนนั้นในที่สุดเราก็มี $ r, $ g และ $ b ในรูปแบบ 255 255 255 (RGB) ซึ่งเราสามารถแปลงเป็นเลขฐานสิบหกของ hex:
$rhex = sprintf("%02X",round($r));
$ghex = sprintf("%02X",round($g));
$bhex = sprintf("%02X",round($b));
$rgbhex = $rhex.$ghex.$bhex;
$ rgbhex คือคำตอบของเรา - สีประกอบกันเป็นฐานสิบหก
เนื่องจากพื้นหลังสีของคุณเป็นสีน้ำเงินหรือ 0,0,255 HSL จึงเป็น
ฮิว (H): 240 องศา / ความอิ่มตัว (S): 100% / ความสว่าง (L): 4.9%
ตรงข้ามกับ 240 คือ 60 ในวงกลมแล้วแปลงกลับเป็น RGB ให้ค่า # 181800