Show HN: VectorNest responsive web-based SVG editor | Hacker News Reader

Show HN: VectorNest responsive web-based SVG editor

ekrsulov.github.io

86 pointsekrsulov35 comments

I’ve just released VectorNest — an open-source, browser-based SVG editor.

If you have an SVG and need quick edits (paths, alignment, small fixes, animations, LLM assistance) without installing software, this is for you.

Try the demo: https://ekrsulov.github.io/vectornest/ GitHub repo: https://github.com/ekrsulov/vectornest

Feedback, issues and contributions are welcome.

Open articleView on HN

I liked the simplistic UI, but it is not quite ready for serious use.

I tried using it on a simple svg that i had (around 1KB, just few simple lines and shapes). But it did not rendered them properly. Colors were off (black-box instead of original colors), and in one place it was showing at triangle instead of an L shaped line.

Also when I move an object, a single Cmd+Z wont undo the action. Have to repeat twice for object to go back (I am using Chrome on macbook)

Thank you — this is exactly the kind of feedback I’m looking for. If you’re able to share the SVG that caused the issue, I’d love to take a look and reproduce the problem.

The undo behavior you described is a known issue — some interactions currently require multiple undo steps, and I’ll be looking for a proper solution in the medium term. Really appreciate you taking the time to test and report this.

How much time did it take you to build it? For the past several years I have been working full time on an SVG editor myself (https://boxy-svg.com) and I get a bit anxious when I see what LLMs are capable of nowadays.

First of all — I’ve seen Boxy before, and congratulations on the product you’ve built. It’s genuinely impressive, especially considering how much depth a serious SVG editor requires.

This result is actually the fourth iteration of VectorNest. In previous versions I would build something, then restart from scratch — but always reusing pieces and, more importantly, the learning from the prior attempts. The big leap happened in the last few months, mainly due to an architectural decision (moving to a plugin-based core) and the noticeable improvement in LLM precision, which made iteration much more reliable.

For me this is a side project, so I only dedicate a few hours per day. I started the first iteration less than a year ago, and the current iteration began about four months ago.

I completely understand the anxiety around what LLMs can now produce — but I also think building something robust and production-ready still requires a lot of architectural thinking and long-term iteration.

Huge thanks for Boxy! I’ve always wanted to know who made it - it’s an impressive piece of software and has been for many years.

Taught me a lot about SVG!

Wow! I'd never heard of it. Just checked it out and it's fantastic. Great job!

One of the very first things I look for in an SVG editor is the ability to reverse paths and adjust winding order.

https://oreillymedia.github.io/Using_SVG/extras/ch06-fill-ru...

Great point — those are supported.

Reverse path is available in the contextual menu, and also in the right sidebar under Subpath Operations when you select a subpath inside a path that contains multiple subpaths.

Fill rule / winding can be changed from the paint menu (the one with the colored circles that expands for fill/stroke options).

Thanks for bringing this up!

Thanks for the reply showing where to change these!

What does "responsive" mean in this case? Can an I make an image that responds to the size its displayed?

In this case, “responsive” means the app itself works on mobile devices (touch interactions, layout adapting to smaller screens, etc.), not that it automatically generates responsive SVGs.

You can, of course, create SVGs that scale properly using `viewBox` and relative units, but VectorNest doesn’t automatically convert a fixed SVG into a responsive layout. The term here refers to the editor UI being usable on both desktop and mobile.

Okay thanks.

I'm curious if there are any tools that allow making responsive SVG. By responsive I mean (1) they respond to @media prefers-color-scheme(dark) (2) they change their look based on size. SVG supports this using CSS. (1) is more important for me.

Currently I have to spit out SVG and manually edit. If I decide to change the original in whatever tool I'm using then I have to manually edit again which is painful. For example, I have to go find every shape I want to change color by hand and then adjust its attributes

Great potential here! I like the easy and friendliness of the tools to use. It would be nice to weld paths. I find myself having to clean up disjointed paths in svgs from time to time. Shapebuilding operations would be incredible, too. Great work!

Thank you! Advanced shape building tools are already available in the third button of the bottom menu (Advanced Tools), and it also includes Trim Path. Boolean operations are implemented as well. I’ll add proper path welding/union to the roadmap. Cleaning messy SVG paths is one of the core problems VectorNest wants to solve, so this feedback is super valuable. Really appreciate you trying it!

Pen tool control points/curves are rendered in the wrong location: https://imgur.com/a/QXQoqOI

Thanks for reporting this! Would you be able to share the SVG you’re testing with and the browser/version you’re using? That would really help me reproduce and investigate the issue.

I believe I’ve been able to reproduce the issue and implemented a fix. Could you please try again and let me know if it’s resolved now?

Now it's good! Great job!

This is awesome! One piece of feedback: on my gesture controlled phone the bottom menu is a bit too low, low enough to overlap with the "gesture bar" at the bottom.

Thank you for the feedback! I’ve created an issue in the repository to investigate this further.

If you’re able to share a bit more detail (device model, OS version, browser, and whether you’re using gesture navigation), that would really help me reproduce the behavior and validate a proper fix.

Really appreciate you taking the time to report it.

Well done, love the minimal UI. The menus are familiar in any case just tucked away for better drawing experience.

Thank you! That was exactly the idea — keep the UI out of the way so the canvas gets the focus, while still keeping familiar tools accessible when needed. Really glad it felt natural to use.

this is so great! thanks for sharing.

any thoughts on what you are going to do next with it? leave as-is or keep adding features?

can you explain the reasoning behind the plugin system a bit more - is it a pattern you came up with or is it based on an existing plugin architecture?

can you add a License to the github?

Thank you! This is definitely an initial version and I hope to keep evolving it with more features over time.

The plugin-centered architecture comes from how the project was built: a large part of the development was done with AI agents (Copilot, Claude, Codex, Antigravity, etc.). To reduce the risk of new features breaking existing functionality, a strong approach was to keep a stable core and implement capabilities as plugins. The project also has many Playwright end-to-end tests that help catch regressions when something fails.

And yes — I’ll review options and add an appropriate license to the GitHub repo soon.

worked well in my quick test. very minimalist menus have a bit of a learning curve for me.

for anyone looking for something similar with a more familiar interface https://www.vectorpea.com/

Thanks for testing it! The minimal UI is intentional, but I totally get the learning curve comment — it’s something I want to keep improving. Vectorpea is great and definitely more familiar for many users. My goal with VectorNest is a lightweight, install-free editor focused on quick SVG fixes and workflows. Appreciate the comparison.

You might consider adding a modal when closing the window with unsaved changes?

Good point — and thank you for the suggestion! In this case it’s actually not necessary because the entire workspace is automatically persisted in local storage, so everything is restored when you reopen the app.

With all respect: Why would one want a drawing tool to be Web-based?

The only app I own that isn’t better as a web app is Blender. Even my IDE is better as a web app. Native apps suck in comparison almost universally.

Totally fair question.

The main idea is removing friction: you can open an SVG from your phone or computer and make quick edits without installing anything. That’s especially useful for small fixes, quick tweaks, or when you’re on a device where you don’t have your usual design tools.

It’s not meant to replace full desktop editors, but to make “edit this SVG right now” fast and accessible anywhere.

Thanks for the reply. I can't think of a situation where I'd just have SVGs hanging out on my phone, though.

I'm looking for an open source eps to svg

Inkscape does that perfectly.

thanks!

Reply on news.ycombinator.com