Source code

Revision control

Copy as Markdown

Other Tools

Test Info:

<html>
<body onload="fillCanvas('white'); fillCanvas('purple');">
<script>
function fillCanvas(gradColor) {
var c = document.getElementById(gradColor + 'Canvas');
var ctx = c.getContext("2d");
// Create solid-color gradient, with all stops same color
var grd = ctx.createRadialGradient(75,50,5,90,60,100);
grd.addColorStop(0,gradColor);
grd.addColorStop(1,gradColor);
// Fill with gradient, but effectively a solid fill
ctx.fillStyle = grd;
ctx.fillRect(0,0,200,100);
}
</script>
<canvas id="whiteCanvas" width="200" height="100"></canvas>
<br>
<canvas id="purpleCanvas" width="200" height="100"></canvas>
</body>
</html>