1 <svg xmlns=
"http://www.w3.org/2000/svg" xmlns:
xlink=
"http://www.w3.org/1999/xlink">
2 <style type=
"text/css" >
5 vector-effect: non-scaling-stroke;
9 <linearGradient id=
"grad1" x1=
"0%" y1=
"0%" x2=
"100%" y2=
"100%">
10 <stop offset=
"0" stop-color=
"blue"/>
11 <stop offset=
"1" stop-color=
"yellow"/>
13 <linearGradient id=
"grad2" x1=
"100" y1=
"150" x2=
"200" y2=
"200" gradientUnits=
"userSpaceOnUse">
14 <stop offset=
"0" stop-color=
"blue"/>
15 <stop offset=
"1" stop-color=
"yellow"/>
17 <pattern id=
"pattern" x=
"0" y=
"0" width=
"20" height=
"20" patternUnits=
"userSpaceOnUse" patternTransform=
"scale(4,0.5), skewX(45)">
18 <rect x=
"0" y=
"0" width=
"10" height=
"10" fill=
"red"/>
19 <rect x=
"10" y=
"0" width=
"10" height=
"10" fill=
"green"/>
20 <rect x=
"0" y=
"10" width=
"10" height=
"10" fill=
"blue"/>
21 <rect x=
"10" y=
"10" width=
"10" height=
"10" fill=
"yellow"/>
23 <rect id=
"rect" width=
"400" height=
"50" fill=
"none"/>
26 <g transform=
"translate(20,20)">
27 <rect width=
"400" height=
"50" fill=
"none" stroke=
"url(#grad1)" transform=
"scale(0.25,1)"/>
30 <rect width=
"400" height=
"50" fill=
"none" stroke=
"url(#grad2)" transform=
"translate(20,100) scale(0.25,1)"/>
32 <use xlink:
href=
"#rect" transform=
"translate(20, 180) scale(0.25,1)" stroke=
"url(#pattern)"/>
34 <use xlink:
href=
"#rect" x=
"40" y=
"80" transform=
"translate(10, 180) scale(0.25,1)" stroke=
"green"/>