Canvas

Canvas Tutorials

Canvas Methods and Properties

Linear Gradient in Canvas in HTML

Linear Gradient

 

 

As we know, a gradient is a smooth transition from one color to another. We can apply it to different shapes, and boxes on canvas.

 

The method used for the linear gradient is:-

 

  • createLinearGradient(x,y,x1,y1)

 

Parameter Explanation:-

 

  • x is the initial x-coordinate.
  • y is the initial y-coordinate.
  • x1 is the final x-coordinate.
  • y1 is the final y-coordinate.

 

For your Information:-

 

The addColorStop() method defines the color stops and their position along the gradient. Gradient positions can be anywhere between 0 to 1.

Code Explanation

All Tutorials related to Canvas Tutorials

All Sections related to Canvas