<div id="gradienttext"></div>
<script type="text/javascript">
function toHex(value)
{
var hex = "0123465789ABCDEF";
var result = hex.charAt(Math.floor(value / 16));
result += hex.charAt(value % 16);
return result;
}
var colorBegin = "#0000C8";
var colorEnd = "#00C800";
var text = "WYSIWYG Web Builder is awesome!";
var r = parseInt(colorBegin.substring(1,3),16);
var g = parseInt(colorBegin.substring(3,5),16);
var b = parseInt(colorBegin.substring(5,7),16);
var rr = parseInt(colorEnd.substring(1,3),16);
var gg = parseInt(colorEnd.substring(3,5),16);
var bb = parseInt(colorEnd.substring(5,7),16);
var r_step = (rr - r) / text.length;
var g_step = (gg - g) / text.length;
var b_step = (bb - b) / text.length;
var html = "";
for (var x = 0; x <= text.length; x++)
{
html = html + \'<span style="color:#\' + toHex(r) + toHex(g) + toHex(b) + \'";">\' + text.charAt(x) + \'</span>\';
r += r_step;
g += g_step;
b += b_step;
}
document.getElementById("gradienttext").innerHTML = html;
</script>