Logic Nodes

TypeScriptSvelteLogicSimulationEditor

Design and simulate logical circuits with this interactive logic simulator.

Logic Nodes is a free online logic gate simulator that runs entirely in your browser. You place gates on a canvas, wire them together, and watch signals propagate live. No account, no install, and circuits can be shared with a single URL. I built it from scratch in TypeScript to understand digital logic better, and it has grown into a full circuit editor that people use to learn boolean algebra and digital circuit design.


What it can do

The simulator covers the full basic toolkit of digital logic: AND, OR, NOT, XOR, NAND, and NOR gates, plus clock, delay, counter, button, toggle, and display nodes for building interactive, time-dependent circuits.


Beyond simulating, it also does the algebra for you:

  • Truth table generation: build a circuit and read off its complete truth table.
  • Boolean expression generation: turn any circuit into its boolean formula, with optional simplification through the Wolfram Alpha API.
  • Circuit synthesis: paste a boolean expression, or fill in a truth table, and the simulator constructs a working circuit from it.
  • Custom nodes: package any circuit into a reusable component, so you can build a half adder once and drop it into a bigger design, all the way up to counters and registers.

The editor itself supports panning and zooming, undo and redo, copy and paste, layers, a minimap for large circuits, keyboard shortcuts, and saving to localStorage or exportable files. Example circuits, including a working calculator, are built in.

Screenshot of the Logic Nodes simulator showing a simple circuit with various logic nodes

Screenshot of the Logic Nodes simulator showing a simple circuit with various logic nodes


How it’s built

The entire editor is hand-written: rendering happens on an HTML5 canvas with no diagramming or graph library underneath, and only the menus and dialogs use Svelte components. That meant solving the problems a library would normally hide for me:

  • Rendering performance: only nodes inside the current viewport are drawn, so large circuits stay smooth while panning and zooming.
  • High-DPI support: the canvas renders crisply on retina displays, including after zooming and loading saved circuits.
  • Hit detection: connection points are small targets, so their hitboxes are computed to stay comfortable to click at any zoom level.
  • Simulation timing: signal propagation runs on a tick system, which is what makes delay nodes, clocks, and feedback circuits like latches behave predictably instead of racing.

The simulation core, the expression parser, and the circuit synthesizer are all plain TypeScript, which keeps the whole thing portable and fast, and the app is deployed as a static site.


I wrote up the harder rendering and interaction problems in a separate post: What I learned hand-writing a canvas node editor. It goes into viewport culling, high-DPI canvas bugs, hitboxes, zoom-to-cursor, and the tick system.


Try it

The simulator is free and open source. Open it at nodes.kriyak.com, or browse the code on GitHub. If you are learning digital logic, start with the built-in examples and try generating a truth table from your first circuit.

More projects

View all projects →

Start a conversation