
Why I Built an SVG Animation Tool That Ships Zero JavaScript
I'm Hari, a software developer from India, and I want to tell you about a problem that kept annoying me until I finally did something about it. The problem Every few weeks, I'd be working on a landing page or a product site and need a simple SVG animation. A sliding icon. A fading shape. A logo that draws itself in. And every time, the solution looked something like this: npm install gsap # or npm install lottie-web GSAP is 100KB+. Lottie is 239KB. That's a lot of JavaScript just to move a rectangle from point A to point B. Here's the thing — browsers already know how to do this. CSS @keyframes can animate SVG elements beautifully. It's a native feature. Zero dependencies. Zero runtime. It just works. But writing keyframe CSS by hand for SVG elements? That's painful. You're tweaking translate() values blindly, refreshing the browser, adjusting, refreshing again. It's slow, tedious, and error-prone. I wanted something in between — the simplicity of CSS animations with a visual editor th
Continue reading on Dev.to Webdev
Opens in a new tab

