<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<svg width="500px" height="500px" viewBox="0 0 100 100">
<!-- <rect x="20" y="20" width="100px" height="150px" fill="red" stroke="blue" stroke-width="10"/>
<ellipse cx="100" cy="100" rx="100" ry="70"> -->
<!-- <line x1="100" y1="200" x2="300" y2="400" stroke="red"/>
<ellipse cx="300" cy="400" rx="100" ry="20"/> -->
<!-- <path d="M20,30 L100,200" stroke="red"/> -->
<path d="M0,0 L0,100 L100,100 L100,0 L0,0" stroke="red" fill="none"/>
<path d="M0,10 L100,10 M0,20 L100,20 M0,30 L100,30 M0,40 L100,40 M0,50 L100,50 M0,60 L100,60 M0,70 L100,70 M0,80 L100,80 M0,90 L100,90" stroke="red"stroke-width="0.5"/>
<path d="M10,0 L10,100 M20,0 L20,100 M30,0 L30,100 M40,0 L40,100 M50,0 L50,100 M60,0 L60,100 M70,0 L70,100 M80,0 L80,100 M90,0 L90,100" stroke="red"stroke-width="0.5"/>
<!-- <path d="M20,20 H50 V10 L70,30 L50,50 V40 H20 V20" stroke="black" fill="blue"/>
<path d="M20,70 l20,20 v-10 h30 v-20 h-30 v-10 z" stroke="black" fill="blue"> -->
<!-- <rect x="20" y="20" rx="2" ry="2" width="60px" height="60px" fill="white" fill-opacity="0.5"/>
<path d="M30,30 h40 v40 h-40 z" fill="black" stroke="black"/>
<circle cx="30" cy="30" r="1" style="fill:red"/>
<circle cx="30" cy="30" r="1" style="fill:red"/>
<circle cx="30" cy="30" r="1" style="fill:red"/>
<circle cx="30" cy="30" r="1" style="fill:red"/> -->
<!-- <path d="M30,50 Q50,10 70,50" stroke="black" fill="none"/> -->
<!-- <path d="M10,50 h80 M50,90 v-80 M50,10 l5,5 M50,10 l-5,5 M90,50 l-5,5 M90,50 l-5,-5" stroke="black" fill="blue"/>
<!-- <path d="M30,50 Q35,70 40,50 M40,50 Q50,10 60,50 M60,50 Q65,70 70,50" stroke="black" fill="none"/> -->
<!-- <path d="M36,50 Q35,35 50,50 M50,50 Q65,35 64,50 M36,50 Q50,90 64,50" stroke="black" fill="none"> -->
<!-- <defs>
<g id="lx">
<rect width="20" height="30" fill="black"/>
</g>
</defs>
<use xlink:href="#lx" x="20" y="40"/>
<use xlink:href="#lx" x="30" y="10"/> -->
<!-- <defs>
<g id="bz">
<circle r="2" fill="white"/>
</g>
<g id="hz">
<circle r="2" fill="black"/>
</g>
</defs>
<use xlink:href="#bz" x="20" y="40"/>
<use xlink:href="#bz" x="20" y="30"/>
<use xlink:href="#bz" x="20" y="50"/>
<use xlink:href="#hz" x="20" y="20"/>
<use xlink:href="#hz" x="30" y="30"/>
<use xlink:href="#hz" x="40" y="40"/>
<use xlink:href="#hz" x="20" y="60"/>
<use xlink:href="#bz" x="50" y="50"/> -->
<!-- <defs>
<filter id="bs" x="0" y="0">
<feGaussianBlur stdDeviation="15"/>
</filter>
</defs>
<rect width="50" height="50" steoke="red" stroke-width="10" fill="blue" filter="url(#bs)"/> -->
<defs>
<linearGradient id="j1" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:blue"/>
<stop offset="100%" style="stop-color:red"/>
</linearGradient>
</defs>
<ellipse cx="50" cy="20" rx="40" ry="20" fill="url(#j1)"/>
</body>
</html>