Code
Execute
<!DOCTYPE html> <html> <head> <title>Wikitechy HTML Canvas createLinearGradient</title> </head> <body> <h2>HTML Canvas createLinearGradient</h2> <canvas id="wikitechyCanvas" width="350" height="180" style="border:1px solid blue;"> </canvas> <script> var a = document.getElementById("wikitechyCanvas"); var gctx = a.getContext("2d"); var clg = gctx.createLinearGradient(0, 0, 200, 0); clg.addColorStop(0, "yellow"); clg.addColorStop(1, "pink"); gctx.fillStyle = clg; gctx.fillRect(80, 20, 200, 110); </script> </body> </html>
Result
