Steven Foerster

Lab

Quantum Circuit Builder

Drag-and-drop quantum circuit designer with state-vector simulation and Qiskit export.

Build and simulate quantum circuits

Design circuits by clicking gates onto qubit wires. Watch the quantum state evolve in real-time and export your circuit to Qiskit Python code. Measurement gates are export markers in this demo and do not collapse the simulated state.

What this is

A visual quantum circuit designer that simulates state evolution for up to 4 qubits. See how gates transform the quantum state and create entanglement between qubits.

What you'll learn

  • Multi-qubit quantum systems
  • Entanglement with CNOT gates
  • Translating circuits to Qiskit code

Single-Qubit Gates

Two-Qubit Gates

Measure

Marks measurement for Qiskit export; simulator stays pre-measurement.

Click a gate, then click on a qubit wire to place it. For two-qubit gates, click control qubit first, then target. `M` marks measurement in exported code only. Tap a placed gate to remove it.

Circuit

0 gates Depth: 0

Qiskit Code

from qiskit import QuantumCircuit

qc = QuantumCircuit(4)

# Add gates here...

State Vector

Amplitudes of computational basis states (pre-measurement)

Measurement Probabilities (pre-measurement)

Individual Qubit States

Reduced density matrix (may be mixed if entangled)

Entanglement

No entanglement (product state)

Challenges

Try building these circuits. Click a challenge to load the goal state.

Key Concepts

Multi-Qubit States

With n qubits, the state vector has 2n complex amplitudes. For 4 qubits, that's 16 basis states from |0000⟩ to |1111⟩. This exponential scaling is why quantum computers can explore many possibilities simultaneously.

Entanglement

Entangled states cannot be written as a product of individual qubit states. The CNOT gate creates entanglement when the control qubit is in superposition. Measuring one qubit instantly determines the other's state.

CNOT Gate

The Controlled-NOT flips the target qubit if the control is |1⟩. It's the fundamental two-qubit gate for creating entanglement and is universal for quantum computing when combined with single-qubit gates.

Circuit Depth

Circuit depth counts sequential gate layers. Gates on different qubits can run in parallel (same depth). Minimizing depth reduces errors on real quantum hardware where qubits decohere over time.

Gate reference

H (Hadamard)

Creates superposition: |0⟩ → |+⟩

X (Pauli-X)

Bit flip: |0⟩ ↔ |1⟩

Z (Pauli-Z)

Phase flip: |1⟩ → −|1⟩

CNOT

Flip target if control is |1⟩

CZ

Apply Z to target if control is |1⟩

SWAP

Exchange two qubit states

Keyboard shortcuts
  • H Select Hadamard gate
  • X Select X gate
  • Z Select Z gate
  • C Select CNOT gate
  • Esc Deselect gate
  • Ctrl+Z Undo
Security model (30 seconds)

This tool runs entirely in your browser. All quantum state calculations happen locally using JavaScript. No data is sent to any server. This is an educational simulation using classical computation to emulate quantum behavior.

Further reading