vendredi 21 septembre 2018

Sou-chi


<svg width="400" height="400">
<defs>
<radialGradient id="lum">
<stop offset="0%" stop-color="#fff">
<animate attributeName="stop-color" begin="0s" dur="6s" repeatCount="indefinite" values="#fff;royalblue;#fff"/>
</stop>
<stop offset="90%" stop-color="royalblue"/>
</radialGradient>
<g id="sush">
<circle cx="50" cy="50" r="50" fill="url(#lum)"/>
<path d="m58 63L58 80L82 67L82 52z" fill="#ffffff"/>
<path d="m10 27L61 57L61 65L10 37z" fill="#b44b4f"/>
<path d="m61 57L88 41L88 49L61 65z" fill="#cd5254"/>
<path d="m37 11L88 41L61 57L10 27z" fill="#f06664"/>
<path d="m15 39L58 63L58 80L15 55z" fill="#e4d1cb"/>
<path d="m19 41L19 33L47 17" fill="none" stroke="#fd8a78" stroke-width="2"/>
<path d="m30 48L30 39L57 24" fill="none" stroke="#fd8a78" stroke-width="2"/>
<path d="m41 54L41 45L68 29" fill="none" stroke="#fd8a78" stroke-width="2"/>
<path d="m52 60L52 52L78 36" fill="none" stroke="#fd8a78" stroke-width="2"/>
</g>
<g id="qsush">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#sush" transform="translate(0 0)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#sush" transform="translate(100 0)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#sush" transform="translate(200 0)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#sush" transform="translate(300 0)"></use>
</g>
<g id="16sush">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#qsush" transform="translate(0 0)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#qsush" transform="translate(0 100)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#qsush" transform="translate(0 200)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#qsush" transform="translate(0 300)"></use>
</g>
</defs>
<rect width="400" height="400" fill="royalblue"/>
<g>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#16sush" transform="translate(0 0)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#16sush" transform="translate(-400 0)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#16sush" transform="translate(0 400)"></use>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#16sush" transform="translate(-400 400)"></use>
<animateMotion begin="0s" dur="6s" repeatCount="indefinite" values="0,0;400,-400"/>
</g>
</svg>