JSFiddle - React, Tailwind, and code Playground

by chrismichaelscott

HTML

<svg>
    <defs>
        <filter id="blur">
            <feGaussianBlur stdDeviation="5" />
        </filter>
    </defs>
    
    <g id="collection">
        <rect stroke="red" stroke-width="3" fill="blue" x="10" y="10" height="100" width="100" />
        <circle stroke="green" stroke-width="8" fill="yellow" cx="150" cy="50" r="40">
            <animate attributeName="cx" from="0" to="150" dur="3s" />
        </circle>
    </g>
    <use xlink:href="#collection" transform="translate(0, 165) scale(1, -0.5)" filter="url(#blur)" />
</svg>