Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

CanvasGradient Redirect 1

« Canvas API

The CanvasGradient interface represents an opaque object describing a gradient and returned by CanvasRenderingContext2D.createLinearGradient or CanvasRenderingContext2D.createRadialGradient methods.

Properties

Representing an opaque object, there is no exposed property.

Methods

There is no inherited method.

CanvasGradient.addColorStop
Add a new stop, defined by an offset and a color, to the gradient. If the offset is not between 0 and 1 an INDEX_SIZE_ERR is raised, if the color can't be parsed as a CSS <color>, a SYNTAX_ERR is raised.

Specifications

Specification Status Comment
WHATWG HTML Living Standard
The definition of 'CanvasGradient' in that specification.
Living Standard No change from Candidate Recommendation
HTML Canvas 2D Context (W3C)
The definition of 'CanvasGradient' in that specification.
Candidate Recommendation Initial definition.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 4.0 Unknown (3.6) [1] 9.0 9.0 3.1
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 3.0 (3.6) [1] ? 10.0 3.2

[1] Before Gecko 5.0, (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2), specifying non-finite values when adding color stops through a call to addColorStop() incorrectly throws SYNTAX_ERR instead of INDEX_SIZE_ERR.

See also

Document Tags and Contributors

 Last updated by: Sheppy,