Hey Dev.to community! 👋
I often faced a small but annoying problem: I needed a circular version of an image file (actual PNG with transparency), not just a visual circle created by CSS border-radius.
Opening Photoshop just to crop a profile picture felt like overkill. So, I built a lightweight tool to solve this.
Meet Circle Crop Image.
🚀 What it does
It’s a simple web utility that lets you upload an image, select a circular area, and download it as a transparent PNG.
💡 Key Features
- Client-Side Processing: Your images are processed locally in your browser using the Canvas API. Nothing is uploaded to a server. 100% Privacy.
- Instant Export: No sign-ups, no watermarks, no ads.
- Responsive: Works great on mobile if you need to create stickers or avatars on the go.
🛠 Under the hood
It relies heavily on the HTML5 Canvas API (ctx.arc, ctx.clip). I wanted to keep it dependency-free and fast.
I'd love for you to try it out and let me know what you think. Is there any feature you'd like to see added?
👉 Try it here: https://circlecropimage.dev/
Thanks for checking it out!
Top comments (0)