SVGGradientElement: gradientTransform property
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
ThegradientTransform read-only property of theSVGGradientElement interface reflects thegradientTransform attribute of the given element.
In this article
Value
Examples
>Accessing thegradientTransform property
html
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"> <defs> <linearGradient gradientTransform="rotate(45)"> <stop offset="0%" stop-color="red" /> <stop offset="100%" stop-color="blue" /> </linearGradient> </defs> <rect x="10" y="10" width="180" height="180" fill="url(#gradient3)" /></svg>js
// Accessing the gradientTransform propertyconst gradient = document.getElementById("gradient3");console.dir(gradient.gradientTransform.baseVal);// Output: SVGTransformList objectSpecifications
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2> # __svg__SVGGradientElement__gradientTransform> |