グラデーションする関数

//b=最初の色(#rrggbb)、a=最後の色。 function(i){ 0〜1 の内 i の位置の色"r,g,b"を返す関数 }
// "rgb(r,g,b)" の組を渡すと "rgb(r,g,b)" で返す
function gra_rgb(b,a){ return gra(b,a,parse_rgb,build_rgb) }
// "#rrggbb" の組を渡すと "#rrggbb" で返す
function gra_hexcolor(b,a){ return gra(b,a,parse_hexcolor,build_hexcolor) }

// グラデーションする関数を作る。
function gra(b,a,parser,builder){
  var d = mop.apply(this,[b,a].map(parser));
  return function(i){ return builder([d[0](i),d[1](i),d[2](i)]); }
}

//0〜1 の間の i を与えると i=0(b[n])←→i=1(a[n])の整数配列を返す関数の行列を返す。aとbは数値行列
function mop(b,a){ return b.map(function(x,v){ var s=a[v]-x; return function(i){return Math.ceil(x+s*i) }}) }
// "rgb(r,g,b)" を [r,g,b]に
function parse_rgb(c){ var r=/rgb\(\s*([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)/(c); return r&&r.shift()&&r.map(function(i){return parseInt(i)}) }
// "#rrggbb" を [r,g,b]に
function parse_hexcolor(c){ return [0,1,2].map(function(j){ return parseInt(c[j*2+1]+c[j*2+2],16) }) }
// [r,g,b] → rgb(r,g,b)
function build_rgb(c){ return "rgb("+c+")" }
// [r,g,b] → "#rrggbb"
function build_hexcolor(c){ return "#"+c.map(hex2).join("") }
// 二桁の16進数にする (0f とか)
function hex2(i){return ((i<16)?"0":"")+i.toString(16)}
// 配列に順番に f を適用して返す
Array.prototype.map=function(f){
  var ret=[];
  for(var i=0;i<this.length;i++) ret.push(f(this[i],i,this));
  return ret;
}

えーこれを使うとですね

document.write("<br>")
graF = gra_hexcolor('#FF0000','#11FFFF');

// '#FF0011' 〜 '#11FFFF'へ等間隔に16段階で変化する
for(i=0;i<16;i++){
  document.write("<font color='"+graF(i/15)+"'>■</font>")
}
// '#FF0011' 〜 '#11FFFF'へまるーく16段階で変化する
document.write("<br>")
for(i=0;i<16;i++){
  document.write("<font color='"+graF(Math.sin(i*Math.PI/15))+"'>■</font>")
}
// '#FF0011' 〜 '#11FFFF'へまるーく8段階で変化する
document.write("<br>")
for(i=0;i<8;i++){
  document.write("<font color='"+graF(Math.sin(i*Math.PI/7))+"'>■</font>")
}

function write_gra_string(c1,c2,str,f){
  var g = gra_hexcolor(c1,c2);
  for(i=0;i<str.length;i++){
    document.write("<font color='"+g(f(i,str.length-1))+"'>"+str[i]+"</font>");
  }
}
document.write("<br>")
write_gra_string('#FF0000','#11FFFF',"ようこそnazokingのホームページへ",function(i,l){ return i/l })
document.write("<br>")
write_gra_string('#11FFFF','#000000',"ようこそnazokingのホームページへ",function(i,l){ return Math.sin(i*Math.PI/l) })

■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■
■■■■■■■■
ようこそnazokingのホームページへ
ようこそnazokingのホームページへ

とか作り放題なわけで、多彩な効果が柔軟に！千客万来！