1<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" height="100" width="300" id="color_svg" version="1.1"> 2 <defs id="defs6"> 3 <linearGradient id="lg1"> 4 <stop id="stop849" offset="0" style="stop-color:#729fcf;stop-opacity:1"/> 5 <stop id="stop851" offset="1" style="stop-color:#3465a4;stop-opacity:1"/> 6 </linearGradient> 7 <linearGradient id="lg2"> 8 <stop id="stop841" offset="0" style="stop-color:#75507b;stop-opacity:1"/> 9 <stop id="stop843" offset="1" style="stop-color:#cc0000;stop-opacity:1"/> 10 </linearGradient> 11 <linearGradient id="ColorName" inkscape:swatch="solid"> 12 <stop id="stop841" offset="0" style="stop-color:#123456;stop-opacity:1"/> 13 </linearGradient> 14 <linearGradient gradientUnits="userSpaceOnUse" y2="55" x2="235" y1="15" x1="195" id="slg1" xlink:href="#lg2"/> 15 <linearGradient gradientUnits="userSpaceOnUse" y2="15" x2="235" y1="55" x1="195" id="slg2" xlink:href="#lg1"/> 16 <linearGradient gradientUnits="userSpaceOnUse" y2="15" x2="265" y1="55" x1="195" id="slg3" xlink:href="#lg1"/> 17 <linearGradient gradientUnits="userSpaceOnUse" y2="15" x2="265" y1="55" x1="195" id="slg4" xlink:href="#ColorName"/> 18 <style id="style0"><![CDATA[ 19#r2 { 20 fill:#3465a4; 21 stroke:#729fcf; 22 stop-color:blue; 23} 24 ]]></style> 25 </defs> 26 <!--Regular shape with style properties--> 27 <rect y="15" x="10" height="40" width="40" id="r1" style="opacity:1.0;fill:green;fill-opacity:0.9;stroke:green;stroke-width:10;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.5;paint-order:markers fill stroke;stop-color:green"/> 28 <!--Regular shape with css styles--> 29 <rect y="15" x="60" height="40" width="40" id="r2" style="opacity:1;fill-opacity:1;stroke-width:10;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke"/> 30 <!--Regular shape with element attributes--> 31 <rect y="15" x="110" height="40" width="40" id="r3" fill="#cc0000" fill-opacity="0.9" stroke="#2e3436" stroke-opacity="0.5" style="opacity:0.81;stroke:#2e3436;stroke-width:10;stroke-miterlimit:4;stroke-dasharray:none;paint-order:markers fill stroke;stop-color:red"/> 32 <!--Regular shape with swatch--> 33 <rect y="15" x="160" height="40" width="40" id="r4" style="opacity:1;fill:url(#slg4);fill-opacity:1;stroke:url(#slg2);stroke-width:10;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.5;paint-order:markers fill stroke;stop-color:#000000"/> 34 <!--Regular shape with gradients--> 35 <rect y="15" x="210" height="40" width="40" id="r4" style="opacity:1;fill:url(#slg1);fill-opacity:1;stroke:url(#slg2);stroke-width:10;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.5;paint-order:markers fill stroke;stop-color:#000000"/> 36 <!--A copy of the gradient to test url hygiene--> 37 <rect y="15" x="260" height="40" width="40" id="r5" style="opacity:1;fill:url(#slg1);fill-opacity:1;stroke:url(#slg3);stroke-width:10;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.5;paint-order:markers fill stroke;stop-color:#000000"/> 38</svg>