1  <svg xmlns="http://www.w3.org/2000/svg" width="200" height="100">
 2    <style>
 3      .fancy { fill: orange; stroke: black; stroke-width: 2; }
 4      .glow { filter: url(#glow); }
 5    </style>
 6  
 7    <defs>
 8      <filter id="glow">
 9        <feGaussianBlur stdDeviation="3" result="blur"/>
10        <feMerge>
11          <feMergeNode in="blur"/>
12          <feMergeNode in="SourceGraphic"/>
13        </feMerge>
14      </filter>
15    </defs>
16  
17    <circle id="c1" cx="50" cy="50" r="30" class="fancy"/>
18    <rect id="r1" x="100" y="30" width="60" height="40" class="fancy"/>
19  
20    <script type="application/ecmascript"><![CDATA[
21      const f = Math.random() * 10 + 10; // initial speed
22      const delta = 0.3;
23      const start = Date.now();
24      const c = document.getElementById('c1');
25      const r = document.getElementById('r1');
26  
27      function update() {
28        const t = (Date.now() - start) / 1000; // seconds
29        const s = f * Math.exp(-delta * t);
30        const i = Math.floor(s) % 2;
31  
32        if (i === 0) {
33          c.setAttribute('class', 'fancy glow');
34          r.setAttribute('class', 'fancy');
35        } else {
36          c.setAttribute('class', 'fancy');
37          r.setAttribute('class', 'fancy glow');
38        }
39  
40        if (s > 0.1) requestAnimationFrame(update);
41      }
42  
43      update();
44    ]]></script>
45  </svg>