Launching today

Variable Width SVG

Launching today

Turn SVG strokes into expressive variable-width icons

2 followers

Turn SVG strokes into expressive variable-width icons

2 followers

Visit website

Give SVG icons controlled thick-to-thin strokes. Explore 204 curated examples, copy editable SVG outlines, and see how the algorithm works. Use the open-source npm package with explicit width recipes to convert your own supported stroke-based icons. Conversion runs locally with Node.js and Python; the website previews pre-generated results.

Free

Launch tags:Design Tools•Open Source•Icons

Launch Team

Customer.ioAutomate Messaging Everywhere — Startups Get 12 Months Free

Promoted

Maker

📌

Hi Product Hunt, I’m weihua, a design engineer. I built Variable Width SVG to explore how a little stroke variation can change the character of an icon. The converter uses a centerline and an explicit width recipe to generate editable, filled SVG outlines. You can browse and copy 204 curated examples, compare the algorithm’s stages, or use the open-source npm package with your own supported icons. The converter requires Node.js and Python; the website displays pre-generated examples. This is an early experimental release. Complex intersections and some SVG inputs still need manual review. I’d love to hear which icons you’d try it on and where the results could improve.

Report

1d ago