»
EnglishFrenchVietnamese

Print - ColorPicker 3.1 - JavaScriptBank.com

Full version: jsB@nk » Utility » Generator » ColorPicker 3.1
URL: http://www.javascriptbank.com/colorpicker-3-1-index.html

ColorPicker 3.1 © JavaScriptBank.comThis color picker will help you fine tune the hex color codes for your web page. First choose whether you wish to play with the Background Color, Text Color, Link Color, Visited Link Color, Active Link Color or Hover Color and check the appropriate round radio button.

Full version: jsB@nk » Utility » Generator » ColorPicker 3.1
URL: http://www.javascriptbank.com/colorpicker-3-1-index.html



CSS
<link rel="stylesheet" type="text/css" href="picker.css"><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script type="text/javascript" src="picker.js"></script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<body onLoad="startMeUp();"><table cellpadding="0" cellspacing="0" style="margin-top:8px;margin-bottom:15px;clear:both;"><tr><!-- left --><td valign="top" style="width:324px;"><div style="text-align:center"><table cellpadding="0" cellspacing="0" width="302"><tr><td align="left"><span style="font:bold 22px tahoma;"><span style="color:#2100B4;">C</span><span style="color:#2B00A9;">o</span><span style="color:#36009F;">l</span><span style="color:#400094;">o</span><span style="color:#4B008A;">r</span><span style="color:#55007F;">P</span><span style="color:#600075;">i</span><span style="color:#6A006A;">c</span><span style="color:#750060;">k</span><span style="color:#7F0055;">e</span><span style="color:#8A004B;">r</span><span style="color:#940040;"> </span><span style="color:#9F0036;">3</span><span style="color:#A9002B;">.</span><span style="color:#B40021;">1</span></span></td></tr></table><span class="getcolorlinks_red"><span class="getcolorlinks_red_label">&nbsp;Red:&nbsp;&nbsp;</span><a href="javascript:colorsOne('R','00');" class="getcolorlinks_r" id="R00">00</a><a href="javascript:colorsOne('R','11');" class="getcolorlinks_r" id="R11">11</a><a href="javascript:colorsOne('R','22');" class="getcolorlinks_r" id="R22">22</a><a href="javascript:colorsOne('R','33');" class="getcolorlinks_r" id="R33">33</a><a href="javascript:colorsOne('R','44');" class="getcolorlinks_r" id="R44">44</a><a href="javascript:colorsOne('R','55');" class="getcolorlinks_r" id="R55">55</a><a href="javascript:colorsOne('R','66');" class="getcolorlinks_r" id="R66">66</a><a href="javascript:colorsOne('R','77');" class="getcolorlinks_r" id="R77">77</a><a href="javascript:colorsOne('R','88');" class="getcolorlinks_r" id="R88">88</a><a href="javascript:colorsOne('R','99');" class="getcolorlinks_r" id="R99">99</a><a href="javascript:colorsOne('R','AA');" class="getcolorlinks_r" id="RAA">AA</a><a href="javascript:colorsOne('R','BB');" class="getcolorlinks_r" id="RBB">BB</a><a href="javascript:colorsOne('R','CC');" class="getcolorlinks_r" id="RCC">CC</a><a href="javascript:colorsOne('R','DD');" class="getcolorlinks_r" id="RDD">DD</a><a href="javascript:colorsOne('R','EE');" class="getcolorlinks_r" id="REE">EE</a><a href="javascript:colorsOne('R','FF');" class="getcolorlinks_r" id="RFF">FF</a>&nbsp;<br></span><span class="getcolorlinks_green"><span class="getcolorlinks_green_label">&nbsp;Green:</span><a href="javascript:colorsOne('G','00');" class="getcolorlinks_g" id="G00">00</a><a href="javascript:colorsOne('G','11');" class="getcolorlinks_g" id="G11">11</a><a href="javascript:colorsOne('G','22');" class="getcolorlinks_g" id="G22">22</a><a href="javascript:colorsOne('G','33');" class="getcolorlinks_g" id="G33">33</a><a href="javascript:colorsOne('G','44');" class="getcolorlinks_g" id="G44">44</a><a href="javascript:colorsOne('G','55');" class="getcolorlinks_g" id="G55">55</a><a href="javascript:colorsOne('G','66');" class="getcolorlinks_g" id="G66">66</a><a href="javascript:colorsOne('G','77');" class="getcolorlinks_g" id="G77">77</a><a href="javascript:colorsOne('G','88');" class="getcolorlinks_g" id="G88">88</a><a href="javascript:colorsOne('G','99');" class="getcolorlinks_g" id="G99">99</a><a href="javascript:colorsOne('G','AA');" class="getcolorlinks_g" id="GAA">AA</a><a href="javascript:colorsOne('G','BB');" class="getcolorlinks_g" id="GBB">BB</a><a href="javascript:colorsOne('G','CC');" class="getcolorlinks_g" id="GCC">CC</a><a href="javascript:colorsOne('G','DD');" class="getcolorlinks_g" id="GDD">DD</a><a href="javascript:colorsOne('G','EE');" class="getcolorlinks_g" id="GEE">EE</a><a href="javascript:colorsOne('G','FF');" class="getcolorlinks_g" id="GFF">FF</a>&nbsp;<br></span><span class="getcolorlinks_blue"><span class="getcolorlinks_blue_label">&nbsp;Blue:&nbsp;</span><a href="javascript:colorsOne('B','00');" class="getcolorlinks_b" id="B00">00</a><a href="javascript:colorsOne('B','11');" class="getcolorlinks_b" id="B11">11</a><a href="javascript:colorsOne('B','22');" class="getcolorlinks_b" id="B22">22</a><a href="javascript:colorsOne('B','33');" class="getcolorlinks_b" id="B33">33</a><a href="javascript:colorsOne('B','44');" class="getcolorlinks_b" id="B44">44</a><a href="javascript:colorsOne('B','55');" class="getcolorlinks_b" id="B55">55</a><a href="javascript:colorsOne('B','66');" class="getcolorlinks_b" id="B66">66</a><a href="javascript:colorsOne('B','77');" class="getcolorlinks_b" id="B77">77</a><a href="javascript:colorsOne('B','88');" class="getcolorlinks_b" id="B88">88</a><a href="javascript:colorsOne('B','99');" class="getcolorlinks_b" id="B99">99</a><a href="javascript:colorsOne('B','AA');" class="getcolorlinks_b" id="BAA">AA</a><a href="javascript:colorsOne('B','BB');" class="getcolorlinks_b" id="BBB">BB</a><a href="javascript:colorsOne('B','CC');" class="getcolorlinks_b" id="BCC">CC</a><a href="javascript:colorsOne('B','DD');" class="getcolorlinks_b" id="BDD">DD</a><a href="javascript:colorsOne('B','EE');" class="getcolorlinks_b" id="BEE">EE</a><a href="javascript:colorsOne('B','FF');" class="getcolorlinks_b" id="BFF">FF</a>&nbsp;<br></span><table cellspacing="1" cellpadding="0" style="margin-top:6px;margin-bottom:0px;background-color:#444444;"><tr><td class="colorchart" style="background-color:#330000" onClick="colorsAll('330000')" title="330000"></td><td class="colorchart" style="background-color:#333300" onClick="colorsAll('333300')" title="333300"></td><td class="colorchart" style="background-color:#336600" onClick="colorsAll('336600')" title="336600"></td><td class="colorchart" style="background-color:#339900" onClick="colorsAll('339900')" title="339900"></td><td class="colorchart" style="background-color:#33CC00" onClick="colorsAll('33CC00')" title="33CC00"></td><td class="colorchart" style="background-color:#33FF00" onClick="colorsAll('33FF00')" title="33FF00"></td><td class="colorchart" style="background-color:#66FF00" onClick="colorsAll('66FF00')" title="66FF00"></td><td class="colorchart" style="background-color:#66CC00" onClick="colorsAll('66CC00')" title="66CC00"></td><td class="colorchart" style="background-color:#669900" onClick="colorsAll('669900')" title="669900"></td><td class="colorchart" style="background-color:#666600" onClick="colorsAll('666600')" title="666600"></td><td class="colorchart" style="background-color:#663300" onClick="colorsAll('663300')" title="663300"></td><td class="colorchart" style="background-color:#660000" onClick="colorsAll('660000')" title="660000"></td><td class="colorchart" style="background-color:#FF0000" onClick="colorsAll('FF0000')" title="FF0000"></td><td class="colorchart" style="background-color:#FF3300" onClick="colorsAll('FF3300')" title="FF3300"></td><td class="colorchart" style="background-color:#FF6600" onClick="colorsAll('FF6600')" title="FF6600"></td><td class="colorchart" style="background-color:#FF9900" onClick="colorsAll('FF9900')" title="FF9900"></td><td class="colorchart" style="background-color:#FFCC00" onClick="colorsAll('FFCC00')" title="FFCC00"></td><td class="colorchart" style="background-color:#FFFF00" onClick="colorsAll('FFFF00')" title="FFFF00"></td></tr><tr><td class="colorchart" style="background-color:#330033" onClick="colorsAll('330033')" title="330033"></td><td class="colorchart" style="background-color:#333333" onClick="colorsAll('333333')" title="333333"></td><td class="colorchart" style="background-color:#336633" onClick="colorsAll('336633')" title="336633"></td><td class="colorchart" style="background-color:#339933" onClick="colorsAll('339933')" title="339933"></td><td class="colorchart" style="background-color:#33CC33" onClick="colorsAll('33CC33')" title="33CC33"></td><td class="colorchart" style="background-color:#33FF33" onClick="colorsAll('33FF33')" title="33FF33"></td><td class="colorchart" style="background-color:#66FF33" onClick="colorsAll('66FF33')" title="66FF33"></td><td class="colorchart" style="background-color:#66CC33" onClick="colorsAll('66CC33')" title="66CC33"></td><td class="colorchart" style="background-color:#669933" onClick="colorsAll('669933')" title="669933"></td><td class="colorchart" style="background-color:#666633" onClick="colorsAll('666633')" title="666633"></td><td class="colorchart" style="background-color:#663333" onClick="colorsAll('663333')" title="663333"></td><td class="colorchart" style="background-color:#660033" onClick="colorsAll('660033')" title="660033"></td><td class="colorchart" style="background-color:#FF0033" onClick="colorsAll('FF0033')" title="FF0033"></td><td class="colorchart" style="background-color:#FF3333" onClick="colorsAll('FF3333')" title="FF3333"></td><td class="colorchart" style="background-color:#FF6633" onClick="colorsAll('FF6633')" title="FF6633"></td><td class="colorchart" style="background-color:#FF9933" onClick="colorsAll('FF9933')" title="FF9933"></td><td class="colorchart" style="background-color:#FFCC33" onClick="colorsAll('FFCC33')" title="FFCC33"></td><td class="colorchart" style="background-color:#FFFF33" onClick="colorsAll('FFFF33')" title="FFFF33"></td></tr><tr><td class="colorchart" style="background-color:#330066" onClick="colorsAll('330066')" title="330066"></td><td class="colorchart" style="background-color:#333366" onClick="colorsAll('333366')" title="333366"></td><td class="colorchart" style="background-color:#336666" onClick="colorsAll('336666')" title="336666"></td><td class="colorchart" style="background-color:#339966" onClick="colorsAll('339966')" title="339966"></td><td class="colorchart" style="background-color:#33CC66" onClick="colorsAll('33CC66')" title="33CC66"></td><td class="colorchart" style="background-color:#33FF66" onClick="colorsAll('33FF66')" title="33FF66"></td><td class="colorchart" style="background-color:#66FF66" onClick="colorsAll('66FF66')" title="66FF66"></td><td class="colorchart" style="background-color:#66CC66" onClick="colorsAll('66CC66')" title="66CC66"></td><td class="colorchart" style="background-color:#669966" onClick="colorsAll('669966')" title="669966"></td><td class="colorchart" style="background-color:#666666" onClick="colorsAll('666666')" title="666666"></td><td class="colorchart" style="background-color:#663366" onClick="colorsAll('663366')" title="663366"></td><td class="colorchart" style="background-color:#660066" onClick="colorsAll('660066')" title="660066"></td><td class="colorchart" style="background-color:#FF0066" onClick="colorsAll('FF0066')" title="FF0066"></td><td class="colorchart" style="background-color:#FF3366" onClick="colorsAll('FF3366')" title="FF3366"></td><td class="colorchart" style="background-color:#FF6666" onClick="colorsAll('FF6666')" title="FF6666"></td><td class="colorchart" style="background-color:#FF9966" onClick="colorsAll('FF9966')" title="FF9966"></td><td class="colorchart" style="background-color:#FFCC66" onClick="colorsAll('FFCC66')" title="FFCC66"></td><td class="colorchart" style="background-color:#FFFF66" onClick="colorsAll('FFFF66')" title="FFFF66"></td></tr><tr><td class="colorchart" style="background-color:#330099" onClick="colorsAll('330099')" title="330099"></td><td class="colorchart" style="background-color:#333399" onClick="colorsAll('333399')" title="333399"></td><td class="colorchart" style="background-color:#336699" onClick="colorsAll('336699')" title="336699"></td><td class="colorchart" style="background-color:#339999" onClick="colorsAll('339999')" title="339999"></td><td class="colorchart" style="background-color:#33CC99" onClick="colorsAll('33CC99')" title="33CC99"></td><td class="colorchart" style="background-color:#33FF99" onClick="colorsAll('33FF99')" title="33FF99"></td><td class="colorchart" style="background-color:#66FF99" onClick="colorsAll('66FF99')" title="66FF99"></td><td class="colorchart" style="background-color:#66CC99" onClick="colorsAll('66CC99')" title="66CC99"></td><td class="colorchart" style="background-color:#669999" onClick="colorsAll('669999')" title="669999"></td><td class="colorchart" style="background-color:#666699" onClick="colorsAll('666699')" title="666699"></td><td class="colorchart" style="background-color:#663399" onClick="colorsAll('663399')" title="663399"></td><td class="colorchart" style="background-color:#660099" onClick="colorsAll('660099')" title="660099"></td><td class="colorchart" style="background-color:#FF0099" onClick="colorsAll('FF0099')" title="FF0099"></td><td class="colorchart" style="background-color:#FF3399" onClick="colorsAll('FF3399')" title="FF3399"></td><td class="colorchart" style="background-color:#FF6699" onClick="colorsAll('FF6699')" title="FF6699"></td><td class="colorchart" style="background-color:#FF9999" onClick="colorsAll('FF9999')" title="FF9999"></td><td class="colorchart" style="background-color:#FFCC99" onClick="colorsAll('FFCC99')" title="FFCC99"></td><td class="colorchart" style="background-color:#FFFF99" onClick="colorsAll('FFFF99')" title="FFFF99"></td></tr><tr><td class="colorchart" style="background-color:#3300CC" onClick="colorsAll('3300CC')" title="3300CC"></td><td class="colorchart" style="background-color:#3333CC" onClick="colorsAll('3333CC')" title="3333CC"></td><td class="colorchart" style="background-color:#3366CC" onClick="colorsAll('3366CC')" title="3366CC"></td><td class="colorchart" style="background-color:#3399CC" onClick="colorsAll('3399CC')" title="3399CC"></td><td class="colorchart" style="background-color:#33CCCC" onClick="colorsAll('33CCCC')" title="33CCCC"></td><td class="colorchart" style="background-color:#33FFCC" onClick="colorsAll('33FFCC')" title="33FFCC"></td><td class="colorchart" style="background-color:#66FFCC" onClick="colorsAll('66FFCC')" title="66FFCC"></td><td class="colorchart" style="background-color:#66CCCC" onClick="colorsAll('66CCCC')" title="66CCCC"></td><td class="colorchart" style="background-color:#6699CC" onClick="colorsAll('6699CC')" title="6699CC"></td><td class="colorchart" style="background-color:#6666CC" onClick="colorsAll('6666CC')" title="6666CC"></td><td class="colorchart" style="background-color:#6633CC" onClick="colorsAll('6633CC')" title="6633CC"></td><td class="colorchart" style="background-color:#6600CC" onClick="colorsAll('6600CC')" title="6600CC"></td><td class="colorchart" style="background-color:#FF00CC" onClick="colorsAll('FF00CC')" title="FF00CC"></td><td class="colorchart" style="background-color:#FF33CC" onClick="colorsAll('FF33CC')" title="FF33CC"></td><td class="colorchart" style="background-color:#FF66CC" onClick="colorsAll('FF66CC')" title="FF66CC"></td><td class="colorchart" style="background-color:#FF99CC" onClick="colorsAll('FF99CC')" title="FF99CC"></td><td class="colorchart" style="background-color:#FFCCCC" onClick="colorsAll('FFCCCC')" title="FFCCCC"></td><td class="colorchart" style="background-color:#FFFFCC" onClick="colorsAll('FFFFCC')" title="FFFFCC"></td></tr><tr><td class="colorchart" style="background-color:#3300FF" onClick="colorsAll('3300FF')" title="3300FF"></td><td class="colorchart" style="background-color:#3333FF" onClick="colorsAll('3333FF')" title="3333FF"></td><td class="colorchart" style="background-color:#3366FF" onClick="colorsAll('3366FF')" title="3366FF"></td><td class="colorchart" style="background-color:#3399FF" onClick="colorsAll('3399FF')" title="3399FF"></td><td class="colorchart" style="background-color:#33CCFF" onClick="colorsAll('33CCFF')" title="33CCFF"></td><td class="colorchart" style="background-color:#33FFFF" onClick="colorsAll('33FFFF')" title="33FFFF"></td><td class="colorchart" style="background-color:#66FFFF" onClick="colorsAll('66FFFF')" title="66FFFF"></td><td class="colorchart" style="background-color:#66CCFF" onClick="colorsAll('66CCFF')" title="66CCFF"></td><td class="colorchart" style="background-color:#6699FF" onClick="colorsAll('6699FF')" title="6699FF"></td><td class="colorchart" style="background-color:#6666FF" onClick="colorsAll('6666FF')" title="6666FF"></td><td class="colorchart" style="background-color:#6633FF" onClick="colorsAll('6633FF')" title="6633FF"></td><td class="colorchart" style="background-color:#6600FF" onClick="colorsAll('6600FF')" title="6600FF"></td><td class="colorchart" style="background-color:#FF00FF" onClick="colorsAll('FF00FF')" title="FF00FF"></td><td class="colorchart" style="background-color:#FF33FF" onClick="colorsAll('FF33FF')" title="FF33FF"></td><td class="colorchart" style="background-color:#FF66FF" onClick="colorsAll('FF66FF')" title="FF66FF"></td><td class="colorchart" style="background-color:#FF99FF" onClick="colorsAll('FF99FF')" title="FF99FF"></td><td class="colorchart" style="background-color:#FFCCFF" onClick="colorsAll('FFCCFF')" title="FFCCFF"></td><td class="colorchart" style="background-color:#FFFFFF" onClick="colorsAll('FFFFFF')" title="FFFFFF"></td></tr><tr><td class="colorchart" style="background-color:#0000FF" onClick="colorsAll('0000FF')" title="0000FF"></td><td class="colorchart" style="background-color:#0033FF" onClick="colorsAll('0033FF')" title="0033FF"></td><td class="colorchart" style="background-color:#0066FF" onClick="colorsAll('0066FF')" title="0066FF"></td><td class="colorchart" style="background-color:#0099FF" onClick="colorsAll('0099FF')" title="0099FF"></td><td class="colorchart" style="background-color:#00CCFF" onClick="colorsAll('00CCFF')" title="00CCFF"></td><td class="colorchart" style="background-color:#00FFFF" onClick="colorsAll('00FFFF')" title="00FFFF"></td><td class="colorchart" style="background-color:#99FFFF" onClick="colorsAll('99FFFF')" title="99FFFF"></td><td class="colorchart" style="background-color:#99CCFF" onClick="colorsAll('99CCFF')" title="99CCFF"></td><td class="colorchart" style="background-color:#9999FF" onClick="colorsAll('9999FF')" title="9999FF"></td><td class="colorchart" style="background-color:#9966FF" onClick="colorsAll('9966FF')" title="9966FF"></td><td class="colorchart" style="background-color:#9933FF" onClick="colorsAll('9933FF')" title="9933FF"></td><td class="colorchart" style="background-color:#9900FF" onClick="colorsAll('9900FF')" title="9900FF"></td><td class="colorchart" style="background-color:#CC00FF" onClick="colorsAll('CC00FF')" title="CC00FF"></td><td class="colorchart" style="background-color:#CC33FF" onClick="colorsAll('CC33FF')" title="CC33FF"></td><td class="colorchart" style="background-color:#CC66FF" onClick="colorsAll('CC66FF')" title="CC66FF"></td><td class="colorchart" style="background-color:#CC99FF" onClick="colorsAll('CC99FF')" title="CC99FF"></td><td class="colorchart" style="background-color:#CCCCFF" onClick="colorsAll('CCCCFF')" title="CCCCFF"></td><td class="colorchart" style="background-color:#CCFFFF" onClick="colorsAll('CCFFFF')" title="CCFFFF"></td></tr><tr><td class="colorchart" style="background-color:#0000CC" onClick="colorsAll('0000CC')" title="0000CC"></td><td class="colorchart" style="background-color:#0033CC" onClick="colorsAll('0033CC')" title="0033CC"></td><td class="colorchart" style="background-color:#0066CC" onClick="colorsAll('0066CC')" title="0066CC"></td><td class="colorchart" style="background-color:#0099CC" onClick="colorsAll('0099CC')" title="0099CC"></td><td class="colorchart" style="background-color:#00CCCC" onClick="colorsAll('00CCCC')" title="00CCCC"></td><td class="colorchart" style="background-color:#00FFCC" onClick="colorsAll('00FFCC')" title="00FFCC"></td><td class="colorchart" style="background-color:#99FFCC" onClick="colorsAll('99FFCC')" title="99FFCC"></td><td class="colorchart" style="background-color:#99CCCC" onClick="colorsAll('99CCCC')" title="99CCCC"></td><td class="colorchart" style="background-color:#9999CC" onClick="colorsAll('9999CC')" title="9999CC"></td><td class="colorchart" style="background-color:#9966CC" onClick="colorsAll('9966CC')" title="9966CC"></td><td class="colorchart" style="background-color:#9933CC" onClick="colorsAll('9933CC')" title="9933CC"></td><td class="colorchart" style="background-color:#9900CC" onClick="colorsAll('9900CC')" title="9900CC"></td><td class="colorchart" style="background-color:#CC00CC" onClick="colorsAll('CC00CC')" title="CC00CC"></td><td class="colorchart" style="background-color:#CC33CC" onClick="colorsAll('CC33CC')" title="CC33CC"></td><td class="colorchart" style="background-color:#CC66CC" onClick="colorsAll('CC66CC')" title="CC66CC"></td><td class="colorchart" style="background-color:#CC99CC" onClick="colorsAll('CC99CC')" title="CC99CC"></td><td class="colorchart" style="background-color:#CCCCCC" onClick="colorsAll('CCCCCC')" title="CCCCCC"></td><td class="colorchart" style="background-color:#CCFFCC" onClick="colorsAll('CCFFCC')" title="CCFFCC"></td></tr><tr><td class="colorchart" style="background-color:#000099" onClick="colorsAll('000099')" title="000099"></td><td class="colorchart" style="background-color:#003399" onClick="colorsAll('003399')" title="003399"></td><td class="colorchart" style="background-color:#006699" onClick="colorsAll('006699')" title="006699"></td><td class="colorchart" style="background-color:#009999" onClick="colorsAll('009999')" title="009999"></td><td class="colorchart" style="background-color:#00CC99" onClick="colorsAll('00CC99')" title="00CC99"></td><td class="colorchart" style="background-color:#00FF99" onClick="colorsAll('00FF99')" title="00FF99"></td><td class="colorchart" style="background-color:#99FF99" onClick="colorsAll('99FF99')" title="99FF99"></td><td class="colorchart" style="background-color:#99CC99" onClick="colorsAll('99CC99')" title="99CC99"></td><td class="colorchart" style="background-color:#999999" onClick="colorsAll('999999')" title="999999"></td><td class="colorchart" style="background-color:#996699" onClick="colorsAll('996699')" title="996699"></td><td class="colorchart" style="background-color:#993399" onClick="colorsAll('993399')" title="993399"></td><td class="colorchart" style="background-color:#990099" onClick="colorsAll('990099')" title="990099"></td><td class="colorchart" style="background-color:#CC0099" onClick="colorsAll('CC0099')" title="CC0099"></td><td class="colorchart" style="background-color:#CC3399" onClick="colorsAll('CC3399')" title="CC3399"></td><td class="colorchart" style="background-color:#CC6699" onClick="colorsAll('CC6699')" title="CC6699"></td><td class="colorchart" style="background-color:#CC9999" onClick="colorsAll('CC9999')" title="CC9999"></td><td class="colorchart" style="background-color:#CCCC99" onClick="colorsAll('CCCC99')" title="CCCC99"></td><td class="colorchart" style="background-color:#CCFF99" onClick="colorsAll('CCFF99')" title="CCFF99"></td></tr><tr><td class="colorchart" style="background-color:#000066" onClick="colorsAll('000066')" title="000066"></td><td class="colorchart" style="background-color:#003366" onClick="colorsAll('003366')" title="003366"></td><td class="colorchart" style="background-color:#006666" onClick="colorsAll('006666')" title="006666"></td><td class="colorchart" style="background-color:#009966" onClick="colorsAll('009966')" title="009966"></td><td class="colorchart" style="background-color:#00CC66" onClick="colorsAll('00CC66')" title="00CC66"></td><td class="colorchart" style="background-color:#00FF66" onClick="colorsAll('00FF66')" title="00FF66"></td><td class="colorchart" style="background-color:#99FF66" onClick="colorsAll('99FF66')" title="99FF66"></td><td class="colorchart" style="background-color:#99CC66" onClick="colorsAll('99CC66')" title="99CC66"></td><td class="colorchart" style="background-color:#999966" onClick="colorsAll('999966')" title="999966"></td><td class="colorchart" style="background-color:#996666" onClick="colorsAll('996666')" title="996666"></td><td class="colorchart" style="background-color:#993366" onClick="colorsAll('993366')" title="993366"></td><td class="colorchart" style="background-color:#990066" onClick="colorsAll('990066')" title="990066"></td><td class="colorchart" style="background-color:#CC0066" onClick="colorsAll('CC0066')" title="CC0066"></td><td class="colorchart" style="background-color:#CC3366" onClick="colorsAll('CC3366')" title="CC3366"></td><td class="colorchart" style="background-color:#CC6666" onClick="colorsAll('CC6666')" title="CC6666"></td><td class="colorchart" style="background-color:#CC9966" onClick="colorsAll('CC9966')" title="CC9966"></td><td class="colorchart" style="background-color:#CCCC66" onClick="colorsAll('CCCC66')" title="CCCC66"></td><td class="colorchart" style="background-color:#CCFF66" onClick="colorsAll('CCFF66')" title="CCFF66"></td></tr><tr><td class="colorchart" style="background-color:#000033" onClick="colorsAll('000033')" title="000033"></td><td class="colorchart" style="background-color:#003333" onClick="colorsAll('003333')" title="003333"></td><td class="colorchart" style="background-color:#006633" onClick="colorsAll('006633')" title="006633"></td><td class="colorchart" style="background-color:#009933" onClick="colorsAll('009933')" title="009933"></td><td class="colorchart" style="background-color:#00CC33" onClick="colorsAll('00CC33')" title="00CC33"></td><td class="colorchart" style="background-color:#00FF33" onClick="colorsAll('00FF33')" title="00FF33"></td><td class="colorchart" style="background-color:#99FF33" onClick="colorsAll('99FF33')" title="99FF33"></td><td class="colorchart" style="background-color:#99CC33" onClick="colorsAll('99CC33')" title="99CC33"></td><td class="colorchart" style="background-color:#999933" onClick="colorsAll('999933')" title="999933"></td><td class="colorchart" style="background-color:#996633" onClick="colorsAll('996633')" title="996633"></td><td class="colorchart" style="background-color:#993333" onClick="colorsAll('993333')" title="993333"></td><td class="colorchart" style="background-color:#990033" onClick="colorsAll('990033')" title="990033"></td><td class="colorchart" style="background-color:#CC0033" onClick="colorsAll('CC0033')" title="CC0033"></td><td class="colorchart" style="background-color:#CC3333" onClick="colorsAll('CC3333')" title="CC3333"></td><td class="colorchart" style="background-color:#CC6633" onClick="colorsAll('CC6633')" title="CC6633"></td><td class="colorchart" style="background-color:#CC9933" onClick="colorsAll('CC9933')" title="CC9933"></td><td class="colorchart" style="background-color:#CCCC33" onClick="colorsAll('CCCC33')" title="CCCC33"></td><td class="colorchart" style="background-color:#CCFF33" onClick="colorsAll('CCFF33')" title="CCFF33"></td></tr><tr><td class="colorchart" style="background-color:#000000" onClick="colorsAll('000000')" title="000000"></td><td class="colorchart" style="background-color:#003300" onClick="colorsAll('003300')" title="003300"></td><td class="colorchart" style="background-color:#006600" onClick="colorsAll('006600')" title="006600"></td><td class="colorchart" style="background-color:#009900" onClick="colorsAll('009900')" title="009900"></td><td class="colorchart" style="background-color:#00CC00" onClick="colorsAll('00CC00')" title="00CC00"></td><td class="colorchart" style="background-color:#00FF00" onClick="colorsAll('00FF00')" title="00FF00"></td><td class="colorchart" style="background-color:#99FF00" onClick="colorsAll('99FF00')" title="99FF00"></td><td class="colorchart" style="background-color:#99CC00" onClick="colorsAll('99CC00')" title="99CC00"></td><td class="colorchart" style="background-color:#999900" onClick="colorsAll('999900')" title="999900"></td><td class="colorchart" style="background-color:#996600" onClick="colorsAll('996600')" title="996600"></td><td class="colorchart" style="background-color:#993300" onClick="colorsAll('993300')" title="993300"></td><td class="colorchart" style="background-color:#990000" onClick="colorsAll('990000')" title="990000"></td><td class="colorchart" style="background-color:#CC0000" onClick="colorsAll('CC0000')" title="CC0000"></td><td class="colorchart" style="background-color:#CC3300" onClick="colorsAll('CC3300')" title="CC3300"></td><td class="colorchart" style="background-color:#CC6600" onClick="colorsAll('CC6600')" title="CC6600"></td><td class="colorchart" style="background-color:#CC9900" onClick="colorsAll('CC9900')" title="CC9900"></td><td class="colorchart" style="background-color:#CCCC00" onClick="colorsAll('CCCC00')" title="CCCC00"></td><td class="colorchart" style="background-color:#CCFF00" onClick="colorsAll('CCFF00')" title="CCFF00"></td></tr><tr><td class="colorchart" style="background-color:#000000" onClick="colorsAll('000000')" title="000000"></td><td class="colorchart" style="background-color:#111111" onClick="colorsAll('111111')" title="111111"></td><td class="colorchart" style="background-color:#222222" onClick="colorsAll('222222')" title="222222"></td><td class="colorchart" style="background-color:#333333" onClick="colorsAll('333333')" title="333333"></td><td class="colorchart" style="background-color:#444444" onClick="colorsAll('444444')" title="444444"></td><td class="colorchart" style="background-color:#555555" onClick="colorsAll('555555')" title="555555"></td><td class="colorchart" style="background-color:#666666" onClick="colorsAll('666666')" title="666666"></td><td class="colorchart" style="background-color:#777777" onClick="colorsAll('777777')" title="777777"></td><td class="colorchart" style="background-color:#888888" onClick="colorsAll('888888')" title="888888"></td><td class="colorchart" style="background-color:#999999" onClick="colorsAll('999999')" title="999999"></td><td class="colorchart" style="background-color:#AAAAAA" onClick="colorsAll('AAAAAA')" title="AAAAAA"></td><td class="colorchart" style="background-color:#BBBBBB" onClick="colorsAll('BBBBBB')" title="BBBBBB"></td><td class="colorchart" style="background-color:#CCCCCC" onClick="colorsAll('CCCCCC')" title="CCCCCC"></td><td class="colorchart" style="background-color:#DDDDDD" onClick="colorsAll('DDDDDD')" title="DDDDDD"></td><td class="colorchart" style="background-color:#EEEEEE" onClick="colorsAll('EEEEEE')" title="EEEEEE"></td><td class="colorchart" style="background-color:#FFFFFF" onClick="colorsAll('FFFFFF')" title="FFFFFF"></td><td class="colorchart" style="background-color:#444444"></td><td class="colorchart" style="background-color:#444444"></td></tr></table></div><div style="text-align:center"><form name="pickerform" style="margin:0" action=""><table style="font:normal 12px verdana" cellpadding="0" cellspacing="0"><tr><td align="left"><input type="radio" name="chooser" onClick="chooserMode('text')">Text:<input type="text" class="colorbox" readonly name="colorbox_text">&nbsp;&nbsp;</td><td align="left"><input type="radio" name="chooser" onClick="chooserMode('back')" checked>Background:<input type="text" class="colorbox" readonly name="colorbox_back"></td></tr><tr><td align="left"><input type="radio" name="chooser" onClick="chooserMode('link')">Link:<input type="text" class="colorbox" readonly name="colorbox_link"></td><td align="left"><input type="radio" name=chooser onClick="chooserMode('vlink')">Visited Link:<input type="text" class="colorbox" readonly name="colorbox_vlink"></td></tr><tr><td align="left"><input type="radio" name="chooser" onClick="chooserMode('hover')">Hover:<input type="text" class="colorbox" readonly name="colorbox_hover"></td><td align="left"><input type="radio" name="chooser" onClick="chooserMode('alink')">Active Link:<input type="text" class="colorbox" readonly name="colorbox_alink"></td></tr><!--line--><tr><td colspan="2" style="height:1px;background-color:#bbbbbb;"></td></tr><tr><td colspan="2" align="center" style="padding-top:5px;padding-bottom:5px;">Background image (optional) <span class="backhelp" onClick="backHelp();">?</span><br><input type="text" class="bgimagebox" name="bgimage"><input type="button" class="bgimagebtn" value="Set" onClick="doBGImage()"></td></tr><!--line--><tr><td colspan="2" style="height:1px;background-color:#bbbbbb;"></td></tr><tr><td colspan="2" align="center" style="padding-top:5px;padding-bottom:5px;">Font/Size:<select style="font:normal 12px verdana;" onChange="doFontFamily(this.options[this.selectedIndex].value)"><option value="default">[default]<option value="Arial,sans-serif">Arial<option value="Arial Black,sans-serif">Arial Black<option value="Arial Narrow,sans-serif">Arial Narrow<option value="Bookman Old Style,serif">Bookman Old Style<option value="Century Gothic,sans-serif">Century Gothic<option value="Comic Sans MS,sans-serif">Comic Sans MS<option value="Courier New,monospace">Courier New<option value="Georgia,serif">Georgia<option value="Impact,sans-serif">Impact<option value="Lucida Console,monospace">Lucida Console<option value="Tahoma,sans-serif">Tahoma<option value="Times New Roman,serif">Times New Roman<option value="Trebuchet MS,sans-serif">Trebuchet MS<option value="Verdana,sans-serif">Verdana</select><select style="font:normal 12px verdana;" onChange="doFontSize(this.options[this.selectedIndex].value)"><option value="default" selected>--<option value="8">8<option value="9">9<option value="10">10<option value="11">11<option value="12">12<option value="13">13<option value="14">14<option value="15">15<option value="16">16<option value="17">17<option value="18">18<option value="19">19<option value="20">20<option value="22">22<option value="24">24<option value="26">26<option value="28">28<option value="30">30</select></td></tr><!--line--><tr><td colspan="2" style="height:1px;background-color:#bbbbbb;"></td></tr><tr><td colspan="2" align="center"><input type="checkbox" name="boldbox" onClick="doBold()"><b>Bold</b>&nbsp;&nbsp;&nbsp;<input type="checkbox" name="italicbox" onClick="doItalic()"><i>Italic</i>&nbsp;&nbsp;&nbsp;<input type="checkbox" name="underlinelinksbox" onClick="doUnderlineLinks()" checked><span style="text-decoration:underline;">Underline</span> links</td></tr><!--line--><tr><td colspan="2" style="height:1px;background-color:#bbbbbb;"></td></tr></table></form></div><div style="font:normal 10px verdana;margin:16px;">&nbsp;<br>To choose a color, you can click on the color chart, or the Red, Green or Blue bars at the top. The chart contains 216 separate colors along with a gray scale. With the bars you have 4096 different color combinations possible. When using the bars, keep in mind that towards the right is brighter/more color and towards the left is darker/less color.<br>&nbsp;<br>Change the font and font size if you wish, along with rendering <b>bold</b> and <i>italic</i>. You can also enter the URL of a background image or choose not to underline links.<br>&nbsp;<br>When you&#39;re done you can copy the style sheet info and paste it into the head tag of your page... or just use the simple body tag that&#39;s generated. (Note the hover color cannot be done with body tag attributes.)<br>&nbsp;<br>All in all it&#39;s fairly easy to use. If you&#39;re a little lost, just play with it for a while and all will be clear. And, if you&#39;d like a little background on &quot;hex codes&quot;, what they are and where they come from, <a href="http://www.pagetutor.com/colorpicker/about_hex.html">click here</a>.<br>&nbsp;<br>And, if you&#39;d like your own personal ColorPicker that you can use offline, you&#39;ll find one <a href="http://www.pagetutor.com/downloads/colorpicker.html">right here</a>.<br></div></td><!-- right --><td id="rightcell" valign="top" style="border:solid 1px #bbbbbb;padding:10px 20px 0px 20px;"><span style="font-size:22pt" id="heading">Testing Site:</span><noscript><div style="background-color:#ee0000;color:#ffffff;padding:16px"><b>Houston, we have a problem... it would seem that your browser has Javascript disabled. Without Javascript, this ColorPicker won't do much of anything.</b></div></noscript><hr><!-- pt_inline_ad_end --><div id="allspans" style="font-size:12pt;"><span id="text">This is text<br>Now is the time for all good men to come to the aid of their country. And here is a <span id="link2" style="text-decoration:underline;cursor:pointer;" onMouseOver="liteLinkOn('link2')" onMouseOut="liteLinkOff('link2')">link</span> embedded in some text so you can better see how it will look.</span><br>&nbsp;<br><span id="link" style="text-decoration:underline;cursor:pointer;" onMouseOver="liteLinkOn('link')" onMouseOut="liteLinkOff('link')">This is a link</span><br>&nbsp;<br><span id="vlink" style="text-decoration:underline;cursor:pointer;" onMouseOver="liteLinkOn('vlink')" onMouseOut="liteLinkOff('vlink')">This is a visited link</span><br>&nbsp;<br><span id="alink" style="text-decoration:underline;cursor:pointer;" onMouseOver="liteLinkOn('alink')" onMouseOut="liteLinkOff('alink')">This is an active link</span><br>&nbsp;<br><span id="hover" style="text-decoration:underline;">This is the hover color</span><br>&nbsp;<br></div><hr><div id="stylecode"></div></td></tr></table></body><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/utility/ColorPicker_3.1/picker.csshttp://javascriptbank.com/javascript/utility/ColorPicker_3.1/picker.js