Design production network topologies directly in your browser
D

Design production network topologies directly in your browser

Design production network topologies directly in your browser

688 stars
N/A forks
N/A contributors

README

Project documentation from GitHub

Design Production Network Topologies in Your Browser

You know that feeling when you need to sketch out a network topology, and you either reach for a whiteboard (that someone erased before your meeting) or fire up a heavyweight tool like Visio? Neither is great for quick collaboration or version control.

That's where NetViz comes in. It lets you design production-ready network topologies directly in your browser, without installing anything. Think of it as a lightweight, developer-friendly alternative to diagramming tools that actually understands network concepts.


What It Does

NetViz is an open-source web app that lets you create, edit, and share network topology diagrams. You define nodes (servers, routers, switches, firewalls) and connections (links, subnets, VLANs) using a simple visual editor. The output isn't just a pretty picture — it's a structured network model that can be exported, versioned, or plugged into automation workflows.

Under the hood, it's built with HTML/CSS/JS (React or plain JavaScript, from the looks of it), so it runs entirely in your browser. No backend, no accounts, no data leaving your machine unless you want it to.


Why It’s Cool

Here's what stands out:

  • Instant in-browser rendering. Drag, drop, connect. No installs, no plugins.
  • Network-aware, not just generic shapes. You're not drawing boxes and arrows; you're building actual network components. This means connections can carry metadata like IP ranges, protocol types, or latency hints.
  • Exportable and shareable. You can save your topology as a JSON file, embed it, or share a link. Great for PRs, incident postmortems, or architecture reviews.
  • No signup needed. Just open the page and start designing. Perfect for quick brainstorming sessions or prototyping.
  • Open source. Code is on GitHub, so you can fork it, contribute, or run your own instance.

How to Try It

  1. Visit the GitHub repository for installation instructions and a live demo link.
  2. Clone the repo, or use the hosted demo if available.
  3. Start dragging nodes and connecting them. Here's a quick 3-step example:
    • Add a router.
    • Add two subnets.
    • Connect them and assign IP ranges.

The README should have the latest details. If there's a demo link, that's the fastest way to get started.


Final Thoughts

<

Did you like this issue?

Join our weekly newsletter

Love discovering amazing projects?

Help us continue bringing you the best open-source discoveries every week.

Back to Projects
Last updated: May 17, 2026