Watch a demo of different values of the addColorStop() method.
Or click a specific value to see the result:
const c = document.getElementById('myCanvas'); const ctx = c.getContext('2d'); const grd = ctx.createLinearGradient(0,0,150,0); grd.addColorStop(0.4,'red'); grd.addColorStop(0.7,'green'); ctx.fillStyle = grd; ctx.fillRect(0,0,150,100);