Prev Demo
Linear Gradients With Multicolors
Next Demo
Write code here
J
|
B
|
A
<!DOCTYPE html> <html> <head> <title>Linear gradients with multicolors</title> </head> <body> <canvas id="Canvas" width="400" height="300" style="border:2px solid green"></canvas> <script> var canvas = document.getElementById('Canvas'); var context = canvas.getContext('2d'); context.rect(10, 10, 300, 250); var linear = context.createLinearGradient(60, 20, 100, 250); linear.addColorStop(0, 'black'); linear.addColorStop(0.3, 'lime'); linear.addColorStop(0.6, 'red'); linear.addColorStop(1, 'blue'); context.fillStyle = linear; context.fill(); </script> </body> </html>
Note: We DO NOT save your trial code in our database.
Output
