<!DOCTYPE html> <meta charset="utf-8"> <?php // get array of six numbers, 0 - 15 $bg1 = array( "red1" => mt_rand(0,15), "red2" => mt_rand(0,15), "grn1" => mt_rand(0,15), "grn2" => mt_rand(0,15), "blu1" => mt_rand(0,15), "blu2" => mt_rand(0,15) ); $bg2 = array( "red1" => mt_rand(0,15), "red2" => mt_rand(0,15), "grn1" => mt_rand(0,15), "grn2" => mt_rand(0,15), "blu1" => mt_rand(0,15), "blu2" => mt_rand(0,15) ); $bg3 = array( "red1" => mt_rand(0,15), "red2" => mt_rand(0,15), "grn1" => mt_rand(0,15), "grn2" => mt_rand(0,15), "blu1" => mt_rand(0,15), "blu2" => mt_rand(0,15) ); $bgcolor1R = dechex($bg1["red1"]).dechex($bg1["red2"]); // thus, 8 and F become 8F - which happens to be roughly halfway up the red scale; medium dark red $bgcolor1G = dechex($bg1["grn1"]).dechex($bg1["grn2"]); // same for Green $bgcolor1B = dechex($bg1["blu1"]).dechex($bg1["blu2"]); // and now Blue is complete $bgcolor2R = dechex($bg2["red1"]).dechex($bg2["red2"]); // here's color 2 $bgcolor2G = dechex($bg2["grn1"]).dechex($bg2["grn2"]); $bgcolor2B = dechex($bg2["blu1"]).dechex($bg2["blu2"]); $bgcolor3R = dechex($bg3["red1"]).dechex($bg3["red2"]); $bgcolor3G = dechex($bg3["grn1"]).dechex($bg3["grn2"]); $bgcolor3B = dechex($bg3["blu1"]).dechex($bg3["blu2"]); // concatenate each group - this is the final RGB value $bgcolor1 = $bgcolor1R.$bgcolor1G.$bgcolor1B; // here we have a full RGB, e.g., #8F37B9 (octothorpe not included) $bgcolor2 = $bgcolor2R.$bgcolor2G.$bgcolor2B; $bgcolor3 = $bgcolor3R.$bgcolor3G.$bgcolor3B; // add values of first digit of R,G,B values (for math fun) $bgval1 = $bg1["red1"]+$bg1["grn1"]+$bg1["blu1"]; $bgval2 = $bg2["red1"]+$bg2["grn1"]+$bg2["blu1"]; $bgval3 = $bg3["red1"]+$bg3["grn1"]+$bg3["blu1"]; // decide if average RGB is roughly equivalent to light or dark, assign opposite to text color if (($bgval1/3) <= 15/2 && !($bg1["red1"] >= 12 || $bg1["grn1"] >= 12 || $bg1["blu1"] >= 12)) { // make it lighter if the bg is already relatively dark if ($bg1["red1"]+3 >= 15) {$bg1R1 = "F";} else $bg1R1 = dechex($bg1["red1"]+3); // if we go too light, set it to max if ($bg1["grn1"]+3 >= 15) {$bg1G1 = "F";} else $bg1G1 = dechex($bg1["grn1"]+3); if ($bg1["blu1"]+3 >= 15) {$bg1B1 = "F";} else $bg1B1 = dechex($bg1["blu1"]+3); $textcolorbg = $bg1R1.dechex($bg1["red2"]).$bg1G1.dechex($bg1["grn2"]).$bg1B1.dechex($bg1["blu2"]); $mode1 = "Light on dark"; } else { // make it darker if the bg is already relatively light if ($bg1["red1"]-3 <= 0) {$bg1R1 = 0;} else $bg1R1 = dechex($bg1["red1"]-3); // if we go too dark, set it to min if ($bg1["grn1"]-3 <= 0) {$bg1G1 = 0;} else $bg1G1 = dechex($bg1["grn1"]-3); if ($bg1["blu1"]-3 <= 0) {$bg1B1 = 0;} else $bg1B1 = dechex($bg1["blu1"]-3); $textcolorbg = $bg1R1.dechex($bg1["red2"]).$bg1G1.dechex($bg1["grn2"]).$bg1B1.dechex($bg1["blu2"]); $mode1 = "Dark on light"; } if (($bgval2/3) <= 15/2 && !($bg2["red1"] >= 12 || $bg2["grn1"] >= 12 || $bg2["blu1"] >= 12)) { if ($bg2["red1"]+3 >= 15) {$bg2R1 = "F";} else $bg2R1 = dechex($bg2["red1"]+3); if ($bg2["grn1"]+3 >= 15) {$bg2G1 = "F";} else $bg2G1 = dechex($bg2["grn1"]+3); if ($bg2["blu1"]+3 >= 15) {$bg2B1 = "F";} else $bg2B1 = dechex($bg2["blu1"]+3); $textcolorc1 = $bg2R1.dechex($bg2["red2"]).$bg2G1.dechex($bg2["grn2"]).$bg2B1.dechex($bg2["blu2"]); $mode2 = "Light on dark"; } else { if ($bg2["red1"]-3 <= 0) {$bg2R1 = 0;} else $bg2R1 = dechex($bg2["red1"]-3); if ($bg2["grn1"]-3 <= 0) {$bg2G1 = 0;} else $bg2G1 = dechex($bg2["grn1"]-3); if ($bg2["blu1"]-3 <= 0) {$bg2B1 = 0;} else $bg2B1 = dechex($bg2["blu1"]-3); $textcolorc1 = $bg2R1.dechex($bg2["red2"]).$bg2G1.dechex($bg2["grn2"]).$bg2B1.dechex($bg2["blu2"]); $mode2 = "Dark on light"; } if (($bgval3/3) <= 15/2 && !($bg3["red1"] >= 12 || $bg3["grn1"] >= 12 || $bg3["blu1"] >= 12)) { if ($bg3["red1"]+3 >= 15) {$bg3R1 = "F";} else $bg3R1 = dechex($bg3["red1"]+3); if ($bg3["grn1"]+3 >= 15) {$bg3G1 = "F";} else $bg3G1 = dechex($bg3["grn1"]+3); if ($bg3["blu1"]+3 >= 15) {$bg3B1 = "F";} else $bg3B1 = dechex($bg3["blu1"]+3); $textcolorc2 = $bg3R1.dechex($bg3["red2"]).$bg3G1.dechex($bg3["grn2"]).$bg3B1.dechex($bg3["blu2"]); $mode3 = "Light on dark"; } else { if ($bg3["red1"]-3 <= 0) {$bg3R1 = 0;} else $bg3R1 = dechex($bg3["red1"]-3); if ($bg3["grn1"]-3 <= 0) {$bg3G1 = 0;} else $bg3G1 = dechex($bg3["grn1"]-3); if ($bg3["blu1"]-3 <= 0) {$bg3B1 = 0;} else $bg3B1 = dechex($bg3["blu1"]-3); $textcolorc2 = $bg3R1.dechex($bg3["red2"]).$bg3G1.dechex($bg3["grn2"]).$bg3B1.dechex($bg3["blu2"]); $mode3 = "Dark on light"; } // debug /* echo "text colors:<br />".$bgcolor1.": ".$textcolorbg." (".$mode1." ".($bgval1/3).")<br />".$bgcolor2.": ".$textcolorc1. " (".$mode2." ".($bgval2/3).")<br />".$bgcolor3.": ".$textcolorc2." (".$mode3." ".($bgval3/3).")<br />"; */ ?> <title><?php echo "#".$bgcolor1; ?></title> <style type="text/css"> body { padding: 0; margin: 0; background-color: #<?php echo $bgcolor1; ?>; font-family: 'Tahoma', 'Trebuchet MS', 'Verdana', 'Arial', 'Lucida Grande', sans-serif; font-size: 70%; color: #<?php echo $textcolorbg; ?>; } div#bgBlock { position: absolute; bottom: 0px; right: 0px; margin: 0px; width: 100%; height: auto; color: #<?php echo $textcolorbg; ?>; font-size: 15em; font-family: 'Tahoma', 'Trebuchet MS', 'Verdana', 'Arial', 'Lucida Grande', sans-serif; text-align: right; vertical-align: bottom; } div#c1 { width: 30%; min-width: 200px; height: 200px; border-radius: 25px; background-color: #<?php echo $bgcolor2; ?>; color: #<?php echo $textcolorc1; ?>; position: absolute; top: 1em; left: 10%; margin: 10px 50px; font-size: 5em; font-family: 'Tahoma', 'Trebuchet MS', 'Verdana', 'Arial', 'Lucida Grande', sans-serif; text-align: center; vertical-align: middle; } div#c2 { width: 30%; min-width: 200px; height: 200px; border-radius: 25px; background-color: #<?php echo $bgcolor3; ?>; color: #<?php echo $textcolorc2; ?>; position: absolute; top: 2em; right: 10%; margin: 10px 50px; font-size: 5em; font-family: 'Tahoma', 'Trebuchet MS', 'Verdana', 'Arial', 'Lucida Grande', sans-serif; text-align: center; vertical-align: middle; } div#src { position: absolute; top: 1em; right: 10%; } p { float: left; font-size: 2em; margin: 0 20px; } a { display: block; padding: 20px; text-decoration: none; } #c1 a, #c2 a { height: 160px; } a:link, a:visited { color: #<?php echo $textcolorbg; ?>; } #c1 a:link, #c1 a:visited { color: #<?php echo $textcolorc1; ?>; } #c2 a:link, #c2 a:visited { color: #<?php echo $textcolorc2; ?>; } a:hover { color: #<?php echo $bgcolor1; ?>; background-color: #<?php echo $textcolorbg; ?>; } #c1 a:hover { color: #<?php echo $bgcolor2; ?>; background-color: #<?php echo $textcolorc1; ?>; border-radius: 25px; } #c2 a:hover { color: #<?php echo $bgcolor3; ?>; background-color: #<?php echo $textcolorc2; ?>; border-radius: 25px; } a:active, a:focus { border: none; } :focus { outline: none; } #src a {display: inline; padding: .5em;} </style> </head> <body> <p>refresh this page for a new color.</p> <div id="c1"> <a href="randombg2.php"><?php echo "#".$bgcolor2; ?></a> </div> <div id="c2"> <a href="randombg2.php"><?php echo "#".$bgcolor3; ?></a> </div> <div id="bgBlock"> <a href="randombg2.php"><?php echo "#".$bgcolor1; ?></a> </div> <div id="src"> source file here: <a href="randombg2.html">html</a> | <a href="randombg2.txt">txt</a> </div> </body> </html>