I’ve always loved how p5.js made it super easy to create fun, playful interactions in code. You can make something come alive with just a few lines — cursor-following eyes, floating shapes, reactive visuals. It felt like sketching with code.

But when I switched gears to frontend development (especially in React), I realized something was missing...

I wanted to bring that creative energy into my everyday UI work.

That’s why I built svggles — a small React utility that makes it easy to add interactive SVG illustrations to your projects. Think of it as a fun toolkit for adding “just a little magic” to your frontend.

svggles logo

What is svggles?

svggles (published as interactive-illustrations) is a React package that lets you create SVG-based components that respond to Mouse movement, Scroll, Hover, and custom animations or transformations

It’s lightweight, customizable, and designed to work seamlessly with modern React apps.

How to install:

npm install interactive-illustrations

Playground & Docs

🌐 Website & Examples
📦 NPM package
💻 GitHub repo

If you’ve ever wanted to build a UI that comes alive — try svggles. Let me know what you think, share what you build, and feel free to open a PR with your own ideas!