1. Copy this code:
<html><head><title>Color Text</title><style>
.hexagon {background:#152F56;color:#FFFFFF;}
.pony {background:#2F175C;color:#FFFFFF;}
.bloodlust {background:#222222;color:#FFFFFF;}
.serpent {background:#85FF85;color:#000000;}
.clean {background:#152F56;color:#FFFFFF;}
.hotdog {background:#FF0000;color:#000000;}
#prvtxt {border-radius:4px;box-shadow:2px 2px 5px #07162D;font-family:verdana,sans-serif;font-size:82%;padding:10px;}
.hexagon #prvtxt {background:#213A5F}
.pony #prvtxt {background:#3A2364}
.bloodlust #prvtxt {background:#2D2D2D}
.serpent #prvtxt {background:#8BFF8B}
.clean #prvtxt {background:#213A5F;font-family:arial;}
.hotdog #prvtxt {background:#FFFF00}
.bold {font-weight:bold;}
</style><script>
var grads = [];
grads[0] = [];
grads[1] = [[0,255,64,0],[0.5,255,255,0],[1,255,64,0]];
grads[2] = [[0,255,64,0],[0.2,255,128,0],[0.4,255,255,0],[0.6,0,255,0],[0.8,0,192,255],[1,255,0,255]];
grads[3] = [[0,255,255,255],[0.125,128,128,128],[0.25,255,255,255],[0.375,128,128,128],[0.5,255,255,255],[0.625,128,128,128],[0.75,255,255,255],[0.875,128,128,128],[1,255,255,255]];
grads[4] = [[0,0,160,0],[0.2,0,255,0],[0.4,0,160,0],[0.6,0,255,0],[0.8,0,160,0],[1,0,255,0]];
grads[5] = [[0,0,160,0],[0.1,0,255,0],[0.2,0,160,0],[0.3,0,255,0],[0.4,0,160,0],[0.5,0,255,0],[0.6,0,160,0],[0.7,0,255,0],[0.8,0,160,0],[0.9,0,255,0],[1,0,160,0]];
grads[6] = [[0,0,255,255],[0.125,0,128,255],[0.25,0,255,255],[0.375,0,128,255],[0.5,0,255,255],[0.625,0,128,255],[0.75,0,255,255],[0.875,0,128,255],[1,0,255,255]];
function $(i) {return document.getElementById(i)}
function p(s) {if(s.length==1) {return "0"+s;} return s;}
function color()
{
$("bbtxt").value="";
if($("bolded").checked==true){$("prvtxt").className="bold";}else{$("prvtxt").className="";}
var g=$("grad").selectedIndex;if(g==0){$("prvtxt").innerHTML=$("txtin").value;return;}
if($("bolded").checked==true){$("bbtxt").value+="[b]";}
$("prvtxt").innerHTML="";var tx=$("txtin").value;
var l=tx.replace(/\s/gi,"").length;
for (var x=0, y=0; x<l; x++)
{
while (tx.substr(x+y,1)==" ") {y++;$("prvtxt").innerHTML+=" ";$("bbtxt").value+=" ";}
var pos = x/l;
for (var i=0;i<grads[g].length-1;i++) {if(pos<grads[g][i+1][0]){break;}}
var pct1=1-((pos-grads[g][i][0])/(grads[g][i+1][0]-grads[g][i][0]));var pct2=((pos-grads[g][i][0])/(grads[g][i+1][0]-grads[g][i][0]));
var red=Math.round((pct1*grads[g][i][1])+(pct2*grads[g][i+1][1]));
var grn=Math.round((pct1*grads[g][i][2])+(pct2*grads[g][i+1][2]));
var blu=Math.round((pct1*grads[g][i][3])+(pct2*grads[g][i+1][3]));
var rgb="#"+p(red.toString(16))+p(grn.toString(16))+p(blu.toString(16));
$("prvtxt").innerHTML+="<span style='color:"+rgb+";'>"+tx.substr(x+y,1)+"</span>";
$("bbtxt").value+="[color="+rgb+"]"+tx.substr(x+y,1)+"[/color]";
}
if($("bolded").checked==true){$("bbtxt").value+="[/b]";}
}
</script></head><body onload="$('txtin').value='Your text goes here.';$('bbtxt').value='';$('grad').selectedIndex=0;$('theme').selectedIndex=0" class="hexagon">
<textarea id="txtin" cols="80" rows="7">Your text goes here.</textarea><p><select id="grad" onchange="color()">
<option>None</option>
<option>Fire</option>
<option>Rainbow</option>
<option>Chalk</option>
<option>Dank</option>
<option>Dank2</option>
<option>Ocean</option>
</select> <select id="theme" onchange="document.body.className=this.value;"><option value="hexagon" selected="selected">Hexagon</option>
<option value="pony">Pony</option>
<option value="bloodlust">Bloodlust</option>
<option value="serpent">Serpent</option>
<option value="clean">Hexagon Clean</option>
<option value="hotdog">Hotdog</option>
</select> Bold? <input id="bolded" type="checkbox" checked="checked" onchange="color()"><input type="button" value="Color" onclick="color()">
</p><p id="prvtxt" class="bold">Your text goes here.</p><textarea id="bbtxt" cols="80" rows="7" onclick="this.select()"></textarea></body></html>
2. Paste into Notepad and save as "anything.html" without quotes.
3. Open in web browser.
How to make your own gradients
1. Add a new line:
grads[7] = [[0,255,64,0],[0.5,255,255,0],[1,255,64,0]];
2. Each point has 4 numbers. First number is a position between 0 and 1. Second number is red from 0-255. Third number is green from 0-255. Fourth number is blue from 0-255.
[0,255,64,0] // light red at 0% [0.5,255,255,0] // yellow at 50% [1,255,64,0] // light red at 100%
Start at position 0, end at position 1.
3. Add a new line to the first dropdown:
<option>Name</option>
For more about DText formatting:
For more about DText formatting:
For more about DText formatting:
(USER WAS BANNED FOR THIS POST)
Updated