NN-SVG: Parametric Neural Network Schematics That Export to SVG
Publication-ready NN-architecture schematics.
At a glance
- What is it?
- NN-SVG is a browser-based drawing tool that generates FCNN, CNN and AlexNet-style network figures from parameters and exports them as SVG. It is a diagram generator, not a model visualiser, and that distinction decides whether it fits your workflow.
- Who is it for?
- Adopt NN-SVG if you need a clean, paper-ready schematic of a network topology and you are willing to type the layer sizes yourself; the MIT licence and the SVG export make it painless to drop into a LaTeX or web pipeline. Do not adopt it if you want a diagram that reflects a trained checkpoint, because nothing in the repository reads model files.
- Can I use it commercially?
- Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
- Is it still maintained?
- Yes. The repository last received commits 105 days ago.
- What is it written in?
- Mainly JavaScript, according to GitHub's language statistics.
Answers come from the project's GitHub data, last synced on September 15, 2026, and from our analysis. They are not legal advice.
DEEP OPEN-SOURCE ANALYSIS
The problem NN-SVG targets: hand-drawn architecture figures
The README opens with a complaint that will be familiar to anyone who has submitted a machine learning paper: illustrations of neural network architectures are time-consuming to produce, and researchers end up constructing them from scratch by hand. NN-SVG answers that with a parametric generator. You describe the network as a set of sizes and layout choices, and the tool draws it. The output can be exported to Scalable Vector Graphics, which the README notes is suitable for academic papers or web pages. The intended audience is stated directly: machine learning researchers, with a secondary hope that the software serves as a pedagogical tool. That framing matters. This is a figure-production utility for people who already know what their network looks like and need it drawn, not an exploration tool for people trying to understand one.
Three drawing modes, two rendering libraries
NN-SVG produces three kinds of figure. The first is the classic fully-connected neural network diagram, the stack-of-circles style. The second is a convolutional network figure in the manner of the LeNet paper. The third follows the style introduced in the AlexNet paper. The README is explicit about the split in implementation: the first two are accomplished using D3, and the third with Three.js. That is not a cosmetic detail. D3 produces SVG elements directly, so the FCNN and CNN outputs are vector graphics you can edit in Inkscape or Illustrator. Three.js renders in a WebGL context, which means the AlexNet-style figure is a 3D scene rather than a flat vector drawing. The README still describes SVG export across the tool, but the rendering path for the third mode is different enough that you should verify the export behaves the way you expect before relying on it in a submission.
What you actually configure
The README states that the figure can be styled through many size, color and layout parameters. It does not enumerate them, and the repository material here does not include the parameter list, so the exact key names are not something I can give you. What is clear from the description is the shape of the interaction: you set the dimensions and colouring, you set how layers are arranged, and the drawing updates. If you need the specific parameter names, the README points to a wiki under the repository's Docs link, and the live tool at alexlenail.me/NN-SVG/ is the fastest way to see them. Treat the parameter surface as the thing to inspect first, because it determines whether the tool can express your architecture or only a stylised approximation of it.
Getting it running: hosted tool versus local checkout
There are two paths. The first is the hosted page linked in the README, which is the intended way to use the tool and requires nothing installed. The second is a local checkout of the repository, which the README does not document with build or serve instructions in the material available here. The project is JavaScript, and the presence of D3 and Three.js as dependencies suggests a browser bundle, but I cannot tell you which package manager or which script name to run, because that is not in the supplied text. If you need to self-host, plan to read the repository's own files and the Contributing wiki page rather than following a documented quickstart, because the README does not provide one. For most users the hosted page is sufficient and the local path is only worth the effort if you need to modify the drawing code.
The limitation that matters: it draws what you tell it
NN-SVG has no connection to a trained model. Nothing in the README or the repository description suggests it reads a checkpoint, a framework export, an ONNX graph or a config file from PyTorch or TensorFlow. You type the architecture in. For a paper figure that is often exactly right, because you want a clean, legible abstraction rather than the mess a real graph produces. But it means the diagram can drift from the model it claims to depict, and nothing in the tool will catch that. If your network has skip connections, attention blocks, branching or weight sharing, a parametric layer-stack generator is likely the wrong instrument, and you may spend longer fighting the layout than you would drawing it once by hand. The tool is at its best when the architecture is a straight sequence of layers.
Alternatives and how they differ in approach
The README lists two related projects. vdumoulin/conv_arithmetic is the standard reference for convolutional arithmetic animations, and its purpose is showing how a convolution slides over an input, not drawing a whole network. TensorSpace is the other listed neighbour, and the distinction there is architectural: TensorSpace is built to visualise a model that already exists, loading it and rendering its layers in the browser. NN-SVG goes the opposite direction. It starts from numbers you supply and produces a static figure. If your goal is a figure for a paper, NN-SVG is the closer fit. If your goal is inspecting or presenting a model you have trained, TensorSpace addresses that problem and NN-SVG does not attempt to.
Maintenance, licence and what to check before adopting
The licence is MIT, which permits commercial and academic use with the copyright notice retained. That is about as permissive as it gets, and it is worth noting because it removes the licensing question from your decision almost entirely. On maintenance: the repository is not archived and shows activity into 2026, but the only listed release is 1.0 from January 2019. A project can be actively maintained without cutting releases, and that appears to be the case here, but it also means there is no versioned changelog to consult. For a tool of this size that is a minor concern, since the output is a static SVG you keep. The real cost of adoption is not upgrades, it is the time spent learning the parameters and checking that the exported file renders correctly wherever you are embedding it.
Editorial conclusion
Adopt NN-SVG if you need a clean, paper-ready schematic of a network topology and you are willing to type the layer sizes yourself; the MIT licence and the SVG export make it painless to drop into a LaTeX or web pipeline. Do not adopt it if you want a diagram that reflects a trained checkpoint, because nothing in the repository reads model files. Before you commit, open the live tool, switch between the FCNN, CNN and AlexNet tabs, and confirm the exported SVG opens correctly in your target renderer, since the AlexNet path uses Three.js rather than D3 and produces a different kind of output.
Community notes