The x1 attribute is used to specify the first x-coordinate for drawing an SVG element that requires more than one coordinate. Elements that only need one coordinate use the x attribute instead.
You can use this attribute with the following SVG elements:
For <linearGradient>, x1 defines the x coordinate of the starting point of the gradient vector used to map the gradient stop values. The exact behavior of this attribute is influenced by the gradientUnits attributes
<svgviewBox="0 0 20 10"xmlns="http://www.w3.org/2000/svg"><!--
By default the gradient vector start at the left
bounding limit of the shape it is applied to
--><linearGradientx1="0%"id="g0"><stopoffset="0"stop-color="black"/><stopoffset="100%"stop-color="red"/></linearGradient><rectx="1"y="1"width="8"height="8"fill="url(#g0)"/><!--
Here the gradient vector start at 80% of the left
bounding limit of the shape it is applied to
--><linearGradientx1="80%"id="g1"><stopoffset="0"stop-color="black"/><stopoffset="100%"stop-color="red"/></linearGradient><rectx="11"y="1"width="8"height="8"fill="url(#g1)"/></svg>