Property:
addColorStop:
0.3,'red'
0.4,'red'
0.5,'red'
0.6,'red'
0.6,'#0000FF'
0.6,'orange'
0.6,'rgb(0,255,255)'
Canvas:
your browser does not support the canvas tag
Code:
var c=document.getElementById('myCanvas');
var ctx=c.getContext('2d');
var grd=ctx.createLinearGradient(0,0,150,0);
grd.addColorStop(
0.3,'red')
;
grd.addColorStop(0.7,'green');
ctx.fillStyle=grd;
ctx.fillRect(0,0,150,100);
Click the property values above to see the result
W3Schools.com
- Play it