7种网页调色板打包下载

来源:中国Asp之家时间:2007-8-16 网友评论条【大中小】

中国asp之家注：什么是网页调色板？看了下面的截图您就知道了，呵呵。怎么用？做为站长或者搞程序的，大家应该都用过在线编辑器，对了就像编辑器中的使用调色板给文字设置颜色，非常方便，有了这个调色板不必我们去想蓝色的代码是什么，绿色的代码是什么，只要用鼠标轻轻划过，就OK了。本站收集了7种常见的网页拾色板，看中的别客气下载吧！

这就是一个调色板

1，Windows自带的配色控件

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Windows自带的配色控件 - 中国asp之家 - http://www.aspxhome.com</title> </head> <body> <OBJECT id=dlgHelper CLASSID="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" width="0px" height="0px"></OBJECT> <script> var tempColor = "0099cc"; function returnColor(){ var Hcolor = dlgHelper.ChooseColorDlg(tempColor).toString(16); with(event.srcElement){ value = ((Hcolor.length<6)?"000000".substring(0,6-Hcolor.length):"") + Hcolor; style.backgroundColor = ((Hcolor.length<6)?"000000".substring(0,6-Hcolor.length):"") + Hcolor; } tempColor = Hcolor } </script> <input type="text" value="#0099CC" size="12" onclick="returnColor()" style="background-color: #0099CC"> </body> </html> [提示：你可先修改部分代码，再按运行]

2，不错的调色板

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>javascript调色板 - 中国asp之家 - http://www.aspxhome.com</title> </head> <body> <table align=center> <tr><td align=center> <b>鼠标取色</b><hr noshade color=red size=1> </td></tr> <tr><td class=st9> <b>使用方法：</b><br> <ul> <li>1、先在左边的色域内点击鼠标左键选择颜色 <li>2、然后在右边的色域内用左键选择亮度 <li>3、再将生成的颜色代码粘贴复制到上面的设置框中 <hr noshade color=red size=1> </ul> </td></tr> <tr><td> <SCRIPT language=JavaScript> var SelRGB = ''; var DrRGB = ''; var SelGRAY = '120'; var hexch = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'); function ToHex(n) { var h, l; n = Math.round(n); l = n % 16; h = Math.floor((n / 16)) % 16; return (hexch[h] + hexch[l]); } function DoColor(c, l) { var r, g, b; r = '0x' + c.substring(1, 3); g = '0x' + c.substring(3, 5); b = '0x' + c.substring(5, 7); if(l > 120) { l = l - 120; r = (r * (120 - l) + 255 * l) / 120; g = (g * (120 - l) + 255 * l) / 120; b = (b * (120 - l) + 255 * l) / 120; }else { r = (r * l) / 120; g = (g * l) / 120; b = (b * l) / 120; } return '#' + ToHex(r) + ToHex(g) + ToHex(b); } function EndColor() { var i; if(DrRGB != SelRGB) { DrRGB = SelRGB; for(i = 0; i <= 30; i ++) GrayTable.rows(i).bgColor = DoColor(SelRGB, 240 - i * 8); } SelColor.value = DoColor(RGB.innerText, GRAY.innerText); ShowColor.bgColor = SelColor.value; } </SCRIPT> <SCRIPT event=onclick for=ColorTable language=JavaScript> SelRGB = event.srcElement.bgColor; EndColor(); </SCRIPT> <SCRIPT event=onmouseover for=ColorTable language=JavaScript> RGB.innerText = event.srcElement.bgColor; EndColor(); </SCRIPT> <SCRIPT event=onmouseout for=ColorTable language=JavaScript> RGB.innerText = SelRGB; EndColor(); </SCRIPT> <SCRIPT event=onclick for=GrayTable language=JavaScript> SelGRAY = event.srcElement.title; EndColor(); </SCRIPT> <SCRIPT event=onmouseover for=GrayTable language=JavaScript> GRAY.innerText = event.srcElement.title; EndColor(); </SCRIPT> <SCRIPT event=onmouseout for=GrayTable language=JavaScript> GRAY.innerText = SelGRAY; EndColor(); </SCRIPT> <SCRIPT event=onclick for=Ok language=JavaScript> window.returnValue = SelColor.value; window.close(); </SCRIPT> <DIV align=center> <CENTER> <TABLE border=0 cellPadding=0 cellSpacing=10> <TBODY> <TR> <TD> <TABLE border=0 cellPadding=0 cellSpacing=0 id=ColorTable style="CURSOR: hand"> <SCRIPT language=JavaScript> function wc(r, g, b, n) { r = ((r * 16 + r) * 3 * (15 - n) + 0x80 * n) / 15; g = ((g * 16 + g) * 3 * (15 - n) + 0x80 * n) / 15; b = ((b * 16 + b) * 3 * (15 - n) + 0x80 * n) / 15; document.write('<TD BGCOLOR=#' + ToHex(r) + ToHex(g) + ToHex(b) + ' height=8 width=8></TD>'); } var cnum = new Array(1, 0, 0, 1, 1, 0, 0, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 1, 1, 0, 0); for(i = 0; i < 16; i ++) { document.write('<TR>'); for(j = 0; j < 30; j ++) { n1 = j % 5; n2 = Math.floor(j / 5) * 3; n3 = n2 + 3; wc((cnum[n3] * n1 + cnum[n2] * (5 - n1)), (cnum[n3 + 1] * n1 + cnum[n2 + 1] * (5 - n1)), (cnum[n3 + 2] * n1 + cnum[n2 + 2] * (5 - n1)), i); } document.writeln('</TR>'); } </SCRIPT> <TBODY></TBODY></TABLE></TD> <TD> <TABLE border=0 cellPadding=0 cellSpacing=0 id=GrayTable style="CURSOR: hand"> <SCRIPT language=JavaScript> for(i = 255; i >= 0; i -= 8.5) document.write('<TR BGCOLOR=#' + ToHex(i) + ToHex(i) + ToHex(i) + '><TD TITLE=' + Math.floor(i * 16 / 17) + ' height=4 width=20></TD></TR>'); </SCRIPT> <TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER></DIV> <DIV align=center> <CENTER> <TABLE border=0 cellPadding=0 cellSpacing=10 class=st9> <TBODY> <TR> <TD align=middle rowSpan=2>选中色彩 <TABLE border=1 cellPadding=0 cellSpacing=0 height=40 id=ShowColor width=150> <TBODY> <TR> <TD></TD></TR></TBODY></TABLE></TD> <TD rowSpan=2>基色: <SPAN id=RGB></SPAN><BR>亮度: <SPAN id=GRAY>120</SPAN><BR>代码: <INPUT id=SelColor size=7 class=form_t></TD> </TR> </TBODY> </TABLE> </CENTER> </DIV> </td></tr></table> </body> </html> [提示：你可先修改部分代码，再按运行]

3，216色Typhoon Start JavaScript Fairyland，自己看吧

<HTML><HEAD><TITLE>Typhoon Start JavaScript Fairyland - 中国asp之家 - http://www.aspxhome.com</TITLE> <STYLE type=text/css>#subtext { BACKGROUND-COLOR: #cccccc; FONT-FAMILY: helvetica,arial; FONT-SIZE: 8pt; layer-background-color: #CCCCCC } #title { FONT-FAMILY: helvetica,arial; FONT-SIZE: 13pt; FONT-WEIGHT: bold } #red { BACKGROUND-IMAGE: url(redback.gif); CLIP: rect(0px 256px 10px 0px); HEIGHT: 10px; LEFT: 54px; POSITION: absolute; TOP: 100px; VISIBILITY: visible; WIDTH: 256px; Z-INDEX: 1; layer-background-image: url(redback.gif) } #green { BACKGROUND-IMAGE: url(greenback.gif); CLIP: rect(0px 256px 10px 0px); HEIGHT: 10px; LEFT: 54px; POSITION: absolute; TOP: 120px; VISIBILITY: visible; WIDTH: 256px; Z-INDEX: 1; layer-background-image: url(greenback.gif) } #blue { BACKGROUND-IMAGE: url(blueback.gif); CLIP: rect(0px 256px 10px 0px); HEIGHT: 10px; LEFT: 54px; POSITION: absolute; TOP: 140px; VISIBILITY: visible; WIDTH: 256px; Z-INDEX: 1; layer-background-image: url(blueback.gif) } #redSlider { BACKGROUND-IMAGE: url(scroll-boxh.gif); CLIP: rect(0px 8px 14px 0px); HEIGHT: 14px; LEFT: 50px; POSITION: absolute; TOP: 98px; VISIBILITY: visible; WIDTH: 8px; Z-INDEX: 2; layer-background-image: url(scroll-boxh.gif) } #greenSlider { BACKGROUND-IMAGE: url(scroll-boxh.gif); CLIP: rect(0px 8px 14px 0px); HEIGHT: 14px; LEFT: 50px; POSITION: absolute; TOP: 118px; VISIBILITY: visible; WIDTH: 8px; Z-INDEX: 2; layer-background-image: url(scroll-boxh.gif) } #blueSlider { BACKGROUND-IMAGE: url(scroll-boxh.gif); CLIP: rect(0px 8px 14px 0px); HEIGHT: 14px; LEFT: 50px; POSITION: absolute; TOP: 138px; VISIBILITY: visible; WIDTH: 8px; Z-INDEX: 2; layer-background-image: url(scroll-boxh.gif) } #display { BACKGROUND-COLOR: #000000; HEIGHT: 50px; LEFT: 320px; POSITION: absolute; TOP: 100px; VISIBILITY: visible; WIDTH: 50px; Z-INDEX: 1; layer-background-color: #000000 } #hexValue { HEIGHT: 20px; LEFT: 54px; POSITION: absolute; TOP: 160px; VISIBILITY: visible; WIDTH: 320px; Z-INDEX: 1 } #titleBar { BACKGROUND-COLOR: #dddddd; HEIGHT: 20px; LEFT: 54px; POSITION: absolute; TOP: 70px; WIDTH: 320px; Z-INDEX: 1; layer-background-color: #DDDDDD } #colorTable { HEIGHT: 200px; LEFT: 380px; POSITION: absolute; TOP: 70px; VISIBILITY: visible; WIDTH: 320px; Z-INDEX: 1 } </STYLE> <SCRIPT language=JavaScript>  </SCRIPT> <META content="text/html; charset=gb2312" http-equiv=Content-Type> <META content="MSHTML 5.00.3315.2870" name=GENERATOR></HEAD> <BODY aLink=#33ff33 bgColor=#ffffff link=#33ff33 onload=init() text=#999999 vLink=#33ff33> <DIV id=red></DIV> <DIV id=green></DIV> <DIV id=blue></DIV> <DIV id=redSlider></DIV> <DIV id=greenSlider></DIV> <DIV id=blueSlider></DIV> <DIV id=colorTable> <TABLE border=0 cellPadding=0 cellSpacing=1> <TBODY> <TR> <TD align=middle colSpan=18 id=subtext>Standard 216 Color Palette</TD></TR> <SCRIPT>  </SCRIPT> </TBODY></TABLE></DIV> <DIV id=display><IMG border=0 height=50 src="相当不错的调色板.files/blank.gif" width=50></DIV> <DIV id=titleBar> <TABLE border=0 cellPadding=2 cellSpacing=0 width=320> <TBODY> <TR> <TD id=title>Houser's RGB2HEX DHTML App</TD></TR></TBODY></TABLE></DIV> <DIV id=hexValue> <FORM name=frmValue> <TABLE bgColor=#eeeeee border=0 cellPadding=2 cellSpacing=0 width=320> <TBODY> <TR> <TD align=middle> <TABLE border=0 cellPadding=2 cellSpacing=0> <TBODY> <TR> <TD id=subtext>Red</TD> <TD id=subtext>Green</TD> <TD id=subtext>Blue</TD></TR> <TR> <TD><INPUT maxLength=3 name=RgbDisp onblur="manualSet(this.value,'red');" size=3 value=0></TD> <TD><INPUT maxLength=3 name=rGbDisp onblur="manualSet(this.value,'green');" size=3 value=0></TD> <TD><INPUT maxLength=3 name=rgBDisp onblur="manualSet(this.value,'blue');" size=3 value=0></TD></TR></TBODY></TABLE></TD> <TD align=middle> <TABLE border=0 cellPadding=2 cellSpacing=0> <TBODY> <TR> <TD id=subtext>Hexdecimal</TD></TR> <TR> <TD><INPUT maxLength=6 name=valueDisp onblur=convertHex(); size=6 value=000000></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></FORM></DIV></BODY></HTML> [提示：你可先修改部分代码，再按运行]

4，颜色更丰富了

<html>
<head>
<title>调色板- 中国asp之家 - http://www.aspxhome.com</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<style type="text/css">
 body{background-color: buttonface; }
 input{font-size:9pt;font-family: "verdana,tahoma,arial,sans-serif";}
 button{height:24px;font-size:10pt;font-family: "verdana,tahoma,arial,sans-serif";}
</style>
</head>
<body onSelectStart="return false;" style="margin: 0px;padding: 0px;">
<script language="JavaScript">
document.title="颜色选择"+ document.title;
var iW = 30;//共有6种颜色，每种颜色的宽为iW。iW*6为色带的宽。
var iH = '152';//iH为色带的高。
var iT =20;
var iL = 0;
//var iT = (document.body.offsetHeight-iH)/2;
var H,S,V;
var sr,sg,sb;
var curColor="#000000";
</script>
<table cellspacing="0" cellpadding="0">
    <tr> 
        <td>    
            <input type=text disabled=true size=9 id=ShowColor style="background-color:#000000;disabled:true;"><input type=text disabled=true size=15 id=SelColor value="#000000">
    </td>
  </tr>
</table>
<script language="Javascript">
function SetColor(){
    SelColor.value=curColor.toUpperCase();
    ShowColor.style.background=curColor;
}
function HSV(){
    var pX = event.offsetX;
    var pY = event.offsetY;
    var HalfH = parseInt(iH/2);
    H = parseInt(pX*360/(iW*6));
    if(event.offsetY < HalfH){
        S = pY/HalfH;
        V = 1;
    }else{
        S = 1;
        V = (iH-pY)/HalfH;
    }
    HSVtoRGB();
    rgb=RGB2HTML();
    //HSV.value = 'H:'+H+'  S:'+parseInt(S*100)+'%   V:'+parseInt(V*100)+'%';
    //RGB.value = 'R:'+sr+'  G:'+sg+'   B:'+sb;
    SelColor.value="#"+rgb.toUpperCase();
    ShowColor.style.background= '#'+rgb;
}
function HSVtoRGB(){
    var r,g,b;
    var k = (H%60)/60;
    var c1 = V*(1-S);
    var c2 = V*(1-S*k);
    var c3 = V*(1-S*(1-k));
    switch(parseInt(H/60)){
        case 0 : r=V,g=c3;b=c1; break;
        case 1 : r=c2,g=V;b=c1; break;
        case 2 : r=c1,g=V;b=c3; break;
        case 3 : r=c1,g=c2;b=V; break;
        case 4 : r=c3,g=c1;b=V; break;
        case 5 : r=V,g=c1;b=c2; break;
    }
    sr = parseInt(r*255);
    sg = parseInt(g*255);
    sb = parseInt(b*255);
}
function RGB2HTML(){
    var r=(sr>=16)?sr.toString(16):('0'+sr.toString(16));
    var g=(sg>=16)?sg.toString(16):('0'+sg.toString(16));
    var b=(sb>=16)?sb.toString(16):('0'+sb.toString(16));
    return r+g+b;
}
function finsh(){
    window.returnValue = SelColor.value;
    window.close();
}
function window.onload(){
    var iHtml = '';
    var RainBow = [255,0,0,  255,255,0,  0,255,0,  0,255,255,  0,0,255,  255,0,255,  255,0,0];
    for(var i=0;i<6;i++){
        var R1 = RainBow[i*3];
        var G1 = RainBow[i*3+1];
        var B1 = RainBow[i*3+2];
        var R2 = RainBow[(i+1)*3];
        var G2 = RainBow[(i+1)*3+1];
        var B2 = RainBow[(i+1)*3+2];
        iHtml += "<span style='position:absolute;left:"+(i*iW+iL)+";top:"+iT+";width:"+iW+";height:"+iH+";background:rgb("+R1+","+G1+","+B1+");'></span><span style='position:absolute;left:"+(i*iW+iL)+";top:"+iT+";width:"+iW+";height:"+iH+";background:rgb("+R2+","+G2+","+B2+");filter:alpha(opacity=0,finishopacity=100,Style=1);'></span>"
    }
    iHtml += "<span style=position:absolute;left:"+iL+";top:"+iT+";width:"+iW*6+";height:"+iH/2+";background:rgb(255,255,255);filter:alpha(opacity=100,finishOpacity=0,style=1,starty=0,finishy=100,startx=0,finishx=0)></span><span style=position:absolute;left:"+iL+";top:"+(iT+iH/2)+";width:"+iW*6+";height:"+iH/2+";background:rgb(0,0,0);filter:alpha(opacity=0,finishOpacity=100,style=1,starty=0,finishy=100,startx=0,finishx=0)></span><span style='cursor:crosshair;position:absolute;left:"+iL+";top:"+iT+";width:"+iW*6+";height:"+iH+";' onmousemove=HSV() ondblclick=finsh() onclick='curColor=SelColor.value' onmouseout=SetColor()></span>"
    document.body.innerHTML+=iHtml;
    SetColor();
}
</script>
</body>
</html>

[提示：你可先修改部分代码，再按运行]

5，两个文件一起保存，值得推荐
test1.html

<SCRIPT> var dWin=null; function doDialog() { dWin=showModelessDialog('color.html',window,'status:no;dialogWidth:260px;dialogHeight:200px'); } </SCRIPT> <form name=form1> <input name="color1"> <button onclick="doDialog();" >open</button> </form> [提示：你可先修改部分代码，再按运行]

color.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2311">
<title>调色板- 中国asp之家 - http://www.aspxhome.com</title>
<script>
var ColorHex=new Array('00','33','66','99','CC','FF')
var SpColorHex=new Array('FF0000','00FF00','0000FF','FFFF00','00FFFF','FF00FF')
var current=null

function intocolor()
{
var colorTable=''
for (i=0;i<2;i++)
{
for (j=0;j<6;j++)
{
colorTable=colorTable+'<tr height=12>'
colorTable=colorTable+'<td width=11 style="background-color:#000000">'

if (i==0){
colorTable=colorTable+'<td width=11 style="background-color:#'+ColorHex[j]+ColorHex[j]+ColorHex[j]+'">'} 
else{
colorTable=colorTable+'<td width=11 style="background-color:#'+SpColorHex[j]+'">'} 


colorTable=colorTable+'<td width=11 style="background-color:#000000">'
for (k=0;k<3;k++)
{
for (l=0;l<6;l++)
{
colorTable=colorTable+'<td width=11 style="background-color:#'+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'">'
}
}
}
}
colorTable='<table width=253 border="0" cellspacing="0" cellpadding="0" style="border:1px #000000 solid;border-bottom:none;border-collapse: collapse" bordercolor="000000">'
+'<tr height=30><td colspan=21 bgcolor=#cccccc>'
+'<table cellpadding="0" cellspacing="1" border="0" style="border-collapse: collapse">'
+'<tr><td width="3"><td><input type="text" name="DisColor" size="6" disabled style="border:solid 1px #000000;background-color:#ffff00"></td>'
+'<td width="3"><td><input type="text" name="HexColor" size="7" style="border:inset 1px;font-family:Arial;" value="#000000"></td></tr></table></td></table>'
+'<table border="1" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="000000" onmouseover="doOver()" onmouseout="doOut()" onclick="doclick()" style="cursor:hand;">'
+colorTable+'</table>'; 
colorpanel.innerHTML=colorTable
}

function doOver() {
if ((event.srcElement.tagName=="TD") && (current!=event.srcElement)) {
if (current!=null){current.style.backgroundColor = current._background} 
event.srcElement._background = event.srcElement.style.backgroundColor
DisColor.style.backgroundColor = event.srcElement.style.backgroundColor
HexColor.value = event.srcElement.style.backgroundColor
event.srcElement.style.backgroundColor = "white"
current = event.srcElement
}
}

function doOut() {
if (current!=null) current.style.backgroundColor = current._background
}

function doclick(){
if (event.srcElement.tagName=="TD"){
dialogArguments.form1.color1.value=event.srcElement._background
window.close();
}
}
</script>

<SCRIPT>
function window.onunload()
{
dialogArguments.dWin=null;
}
</SCRIPT>
</head>

<body onload="intocolor()" topmargin=0 leftmargin=0 scroll=no>
<div id="colorpanel" style="position: absolute;">
</div>
</body>
</html>

[提示：你可先修改部分代码，再按运行]

6，ColorMatch 5K

<html> <head> <title>ColorMatch 5K- 中国asp之家 - http://www.aspxhome.com</title> <style> .s{border:inset 1;width:50}.s2{border:outset 1;width:19;height:19;background-color:#E6E6E6;position:absolute;left:1;top:1}.t{font:11px tahoma;color:#555555}.t2{font:bold 36px verdana}</style></head><script language="JavaScript">var mover=moveg=moveb=moveh=0;var hs=new Object();var rg=new Object();rg.r=rg.g=rg.b=0;function click(x,s){if(x<10){x=10};if(x>265){x=265}x-=10;eval("h"+s+".style").left=x+1;eval("rg."+s+"="+x);rg2hs(rg);ud("0",rg);sw.style.backgroundColor="rgb("+rg.r+","+rg.g+","+rg.b+")";dom();}function bclick(s){x=window.event.offsetX+eval("h"+s+".style.pixelLeft-1");click(x,s);}function sc(s){x=window.event.offsetX;click(x,s);}function movee(s){eval("move"+s+"=0")}function rc(x,m){if(x>m){return m}if(x<0){return 0}else{return x}}function rg2hs(rg){m=rg.r;if(rg.g<m){m=rg.g};if(rg.b<m){m=rg.b};v=rg.r;if(rg.g>v){v=rg.g};if(rg.b>v){v=rg.b};value=100*v/255;delta=v-m;if(v==0.0){hs.s=0}else{hs.s=100*delta/v};if(hs.s==0){hs.h=0}else{if(rg.r==v){hs.h=60.0*(rg.g-rg.b)/delta}else if(rg.g==v){hs.h=120.0+60.0*(rg.b-rg.r)/delta}else if(rg.b=v){hs.h=240.0+60.0*(rg.r-rg.g)/delta}if(hs.h<0.0){hs.h=hs.h+360.0}}hs.v=Math.round(value);hs.h=Math.round(hs.h);hs.s=Math.round(hs.s);return(true);}function rg2html(z){return "#"+d2h(z.r)+d2h(z.g)+d2h(z.b);}function d2h(d){hch="0123456789ABCDEF";a=d%16;b=(d-a)/16;return hch.charAt(b)+hch.charAt(a);}function c2r(d){k=window.event.srcElement.style.backgroundColor;j=(k.substr(4,k.indexOf(")")-4)).split(",");click(parseInt(j[0])+10,"r");click(parseInt(j[1])+10,"g");click(parseInt(j[2])+10,"b");}function h2r(hs){var rg=new Object();if(hs.s==0){rg.r=rg.g=rg.b=Math.round(hs.v*2.55);return rg;}hs.s=hs.s/100;hs.v=hs.v/100;hs.h/=60;i=Math.floor(hs.h);f=hs.h-i;p=hs.v*(1-hs.s);q=hs.v*(1-hs.s*f);t=hs.v*(1-hs.s*(1-f));switch(i){case 0:rg.r=hs.v;rg.g=t;rg.b=p;break;case 1:rg.r=q;rg.g=hs.v;rg.b=p;break;case 2:rg.r=p;rg.g=hs.v;rg.b=t;break;case 3:rg.r=p;rg.g=q;rg.b=hs.v;break;case 4:rg.r=t;rg.g=p;rg.b=hs.v;break;default:rg.r=hs.v;rg.g=p;rg.b=q;}rg.r=Math.round(rg.r*255);rg.g=Math.round(rg.g*255);rg.b=Math.round(rg.b*255);return rg;}function ps(x){document.write('<td><div style="width:53;height:53;background-color:rgb(0,0,0);cursor:hand" class=s id="sw'+x+'" onClick="c2r()" title="Click to promote to primary color"></div></td>');}function ph(x){document.write('<td><div class=t id="hc'+x+'">#000000</div></td>');}function ud(x,c){eval("sw"+x).style.backgroundColor="rgb("+c.r+","+c.g+","+c.b+")";eval("hc"+x).innerHTML=rg2html(c)}function pl(t,c,l){document.write('<div style="position:absolute;left:30;top:'+t+';background-color:black"><div class=s style="width:276;height:21;background-color:'+c+';filter:alpha(style=1,startx=360,finishx=0);" onMouseDown="move'+l+'=1;sc(\''+l+'\');" onMouseMove="if(move'+l+'==1){sc(\''+l+'\');}"></div><div class=s2 id=h'+l+' onMouseDown="move'+l+'=1;bclick(\''+l+'\');" onMouseUp="movee(\''+l+'\');" onMouseMove="if(move'+l+'==1){bclick(\''+l+'\');}"></div></div>')}function dom(){z=new Object();y=new Object();yx=new Object();y.s=hs.s;y.h=hs.h;if(hs.v>70){y.v=hs.v-30}else{y.v=hs.v+30};z=h2r(y);ud("1",z);if((hs.h>=0)&&(hs.h<30)){yx.h=y.h=hs.h+20;yx.s=y.s=hs.s;y.v=hs.v;if(hs.v>70){yx.v=hs.v-30}else{yx.v=hs.v+30}}if((hs.h>=30)&&(hs.h<60)){yx.h=y.h=hs.h+150;y.s=rc(hs.s-30,100);y.v=rc(hs.v-20,100);yx.s=rc(hs.s-70,100);yx.v=rc(hs.v+20,100);}if((hs.h>=60)&&(hs.h<180)){yx.h=y.h=hs.h-40;y.s=yx.s=hs.s;y.v=hs.v;if(hs.v>70){yx.v=hs.v-30}else{yx.v=hs.v+30}}if((hs.h>=180)&&(hs.h<220)){yx.h=hs.h-170;y.h=hs.h-160;yx.s=y.s=hs.s;y.v=hs.v;if(hs.v>70){yx.v=hs.v-30}else{yx.v=hs.v+30}}if((hs.h>=220)&&(hs.h<300)){yx.h=y.h=hs.h;yx.s=y.s=rc(hs.s-60,100);y.v=hs.v;if(hs.v>70){yx.v=hs.v-30}else{yx.v=hs.v+30}}if(hs.h>=300){if(hs.s>50){y.s=yx.s=hs.s-40}else{y.s=yx.s=hs.s+40}yx.h=y.h=(hs.h+20)%360;y.v=hs.v;if(hs.v>70){yx.v=hs.v-30}else{yx.v=hs.v+30}}z=h2r(y);ud("2",z);z=h2r(yx);ud("3",z);y.h=0;y.s=0;y.v=100-hs.v;z=h2r(y);ud("4",z);y.h=0;y.s=0;y.v=hs.v;z=h2r(y);ud("5",z);}</script><body onMouseUp="mover=moveg=moveb=0;" bgcolor=#E6E6E6 leftmargin=30 topmargin=30 class=t><div style="width:400"><span class=t2>ColorMatch 5K</span><br><br>This utility will help you select a matching 6-color palette for your website.<br>Define a single color that you like. Matching colors will be calculated.<br>Click a color in the palette to promote it to the primary color.<br><br><b><br>I like this color:<br><br><br><br><br><br><br><br><br><br>6-color matching palette:</div><script>pl(170,"red","r");pl(200,"green","g");pl(230,"blue","b")</script><div class=s id=sw style="position:absolute;left:316;top:170;height:81;width:82;background-color:black;"></div><div style="position:absolute;left:20;top:290;"><table cellspacing=10 cellpadding=0><tr><script>ps(0);ps(1);ps(2);ps(3);ps(4);ps(5);</script></tr><tr><script>ph(0);ph(1);ph(2);ph(3);ph(4);ph(5);</script></tr></table></div> [提示：你可先修改部分代码，再按运行]

7，slayeroffice | tools | color palette creator v1.6

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="Steven G. Chipman" /> <meta name="description" content="A color swatch generator based on the tutorial located here: http://www.stuffandnonsense.co.uk/archives/creating_colour_palettes.html" /> <meta name="copyright" content="(c) 2004 S.G. Chipman" /> <meta name="keywords" content="color, hex, rgb, palette, javascript, dhtml, slayeroffice" /> <title>slayeroffice | tools | color palette creator v1.6- 中国asp之家 - http://www.aspxhome.com</title> <link rel="Stylesheet" type="text/css" href="http://www.cnbruce.com/js/color_palette.css" /> <script language="javascript" type="text/javascript" src="http://www.cnbruce.com/js/color_palette.js"></script> </head> <body> <div class="textContainer"> <span id="hex0"></span> <span id="hex1"></span> <span id="hex2"></span> <span id="hex3"></span> <span id="hex4"></span> </div> <div id="mContainer"> <div id="lightLayer"></div> <div id="darkLayer"></div> </div> <div class="textContainer"> <span id="hex5"></span> <span id="hex6"></span> <span id="hex7"></span> <span id="hex8"></span> <span id="hex9"></span> </div> <div id="controls"> <table class="controlsTable"> <tr> <td>Blend top row with:</td> <td><input title="The color the top row is blended with." type="text" class="txt" id="newLightBlend" value="FFFFFF" /><input type="button" class="btn" value="change" onclick="changeBlend(0);" /></td> </tr> <tr> <td>Blend bottom row with:</td> <td><input title="The color the bottom row is blended with." type="text" class="txt" id="newDarkBlend" value="000000" /><input type="button" class="btn" value="change" onclick="changeBlend(1);" /></td> </tr> <tr> <td>Base Color:</td> <td><input class="txt" title="The color all other colors will derive from." id="newBaseColor" type="text" value="A74661" /><input class="btn" type="button" onclick="createSwatches();" value="ok" /></td> </tr> <tr> <td>Base History:</td> <td><select title="A history of your base colors this session." id="bHistory" onchange="d.getElementById('newBaseColor').value=this.value;createSwatches();"></select><input type="button" onclick="clearBaseHistory();" value="clear history" class="btn" /></td> </tr> <tr> <td><input title="Click this button for a randomly generated base color." class="btn" type="button" onclick="randomBaseColor();" value="random base" /></td> <td><input class="btn" type="button" onclick="saveBase();" value="save base" /><input class="btn" type="button" onclick="viewSaved();" value="view saved" /></td> </tr> <tr> <td><input class="btn" type="button" onclick="showVals('hex');" value="output hex" /></td> <td><input class="btn" type="button" onclick="showVals('rgb');" value="output rgb" /></td> </tr> </table> <table cellpadding="0" cellspacing="0" class="colorTable"> <tr><td id="c0"></td><td id="v0" width="225"></td></tr> <tr><td id="c1"></td><td id="v1"></td></tr> <tr><td id="c2"></td><td id="v2"></td></tr> <tr><td id="c3"></td><td id="v3"></td></tr> <tr><td id="c4"></td><td id="v4"></td></tr> <tr><td id="c5"></td><td id="v5"></td></tr> <tr><td id="c6"></td><td id="v6"></td></tr> <tr><td id="c7"></td><td id="v7"></td></tr> <tr><td id="c8"></td><td id="v8"></td></tr> <tr><td id="c9"></td><td id="v9"></td></tr> </table> <textarea id="txt"></textarea> </div> </body> </html> [提示：你可先修改部分代码，再按运行]

下载地址：7种网页调色板打包下载.rar （15.62 KB）

【加入收藏】【报告错误】【投递文章】【复制地址】【返回顶部↑】

本文地址：http://www.aspxhome.com/download/javascript/20078/137116.htm

站长工具

请稍等，评论加载中...

热门点击排行今日点击排行本周点击排行本月点击排行最新访问排行热门评论排行

7种网页调色板打包下载

Aspxhome.com. 中国Asp之家. 版权所有