Basic Electronics Lab
SIM ACTIVE
v1.0

About This Project

The Basic Electronics Lab Simulator is an interactive, browser-based educational tool for learning analog electronics through real-time physics simulations — no downloads, no SPICE, no hardware required.

MISSION

Making electronics education visual, interactive, and physics-accurate

Traditional textbook electronics is static — equations on pages that don't respond. This simulator lets you see the Shockley equation curve change when temperature shifts, watch the 555 oscillator speed up as you increase capacitance, and observe the op-amp integrator turn a square wave into a triangle. Every simulation computes the physics from scratch on every frame using closed-form analytical models.

LAB PHYSICS DETAILS
01

Diode I-V Characteristics

Shockley diode equation with configurable ideality factor n, saturation current I_S, and thermal voltage V_T. Zener breakdown modeled with exponential reverse-bias current.

FEATURES
  • PN Junction & Zener modes
  • Cursor hover readout (V, I)
  • Temperature-dependent V_T
  • Zener breakdown voltage control
02

Rectifier Circuits

Real-time dual-trace oscilloscope showing AC input vs rectified output. Half-wave uses single diode drop (0.7V). Full-wave bridge uses two diode drops (1.4V). Capacitor filter smoothing optional.

FEATURES
  • Half-wave & Full-wave Bridge
  • Dual-trace oscilloscope
  • Ripple visualization
  • Diode forward-voltage model
03

Clipper & Clamper

Clippers remove signal above/below threshold V_ref ± 0.7V. Clampers shift the DC level using capacitor charge retention. Square wave input for clamper demonstrates DC restoration.

FEATURES
  • Positive/Negative/Double clipper
  • Positive/Negative clamper
  • DC reference voltage control
  • Square or Sine wave input
04

BJT Characteristics

Input: I_B vs V_BE using Shockley model. Output: I_C vs V_CE family of curves with Early Effect (V_A), saturation region, and active/cutoff region shading. I_C = β·I_B(1 + V_CE/V_A).

FEATURES
  • Input & Output characteristics
  • Early Effect (V_A)
  • Region shading (Sat/Active/Cutoff)
  • Interactive cursor crosshairs
05

Op-Amp 741

Four configurations: Inverting (gain = −Rf/Rin), Non-Inverting (gain = 1+Rf/Rin), Integrator (V_out ∝ ∫V_in), Differentiator (V_out ∝ dV_in/dt). Output clamped to ±V_CC rails.

FEATURES
  • 4 configurations
  • ±V_CC rail clamping & saturation warning
  • Sine, Square, Triangle inputs
  • Phase shift (0°/180°/±90°) readout
06

555 Timer IC

Astable: f = 1.44/((R1+2R2)·C), V_cap oscillates between V_CC/3 and 2V_CC/3. Monostable: t_pulse = 1.1·R·C, V_cap rising exponential. Bistable: pure SR latch, no capacitor.

FEATURES
  • Astable free-running oscillator
  • Monostable one-shot pulse
  • Bistable SR flip-flop
  • V_CC/3 & 2V_CC/3 threshold lines
TECHNOLOGY STACK
Astro 6 Framework & SSG

Component-based static site generation with zero client-side JS overhead. Each lab is a self-contained .astro page.

Tailwind CSS Utility Styling

Global design tokens for consistent dark-mode colour palette, spacing, and typography across all labs.

HTML5 Canvas Oscilloscope Rendering

requestAnimationFrame loop renders real-time waveforms at 60fps with glow shadows and anti-aliased traces.

Vanilla JS/TS Physics Engine

All physics computed analytically per frame — no third-party simulation libraries. TypeScript for type safety.

SVG Circuit Diagrams

Inline SVG circuit schematics drawn programmatically — switch per mode without loading external assets.

Google Fonts Typography

Inter for UI text and JetBrains Mono for numerical readouts, waveform labels, and formula display.

01
Parameter capture

Every slider and button maps to a state object in TypeScript. Input events fire instantly — no debounce to avoid lag.

02
Analytical computation per pixel

For each horizontal pixel on the canvas, the exact time t is computed, and the physics formula evaluated analytically — exponentials, integrals, and derivatives solved in closed form.

03
requestAnimationFrame render loop

drawFrame() is called up to 60× per second. It clears the canvas, redraws the grid, threshold lines, both signal traces (with WebGL-style shadow glow), and the HUD overlay.

04
tOffset scrolling

Each frame, tOffset increments by a small amount so the waveform scrolls left — simulating a real oscilloscope sweep. The scroll rate adapts so exactly 3 periods are always visible.

Shockley Diode
I_D = I_S × (exp(V_D / n·V_T) − 1)
Thermal Voltage
V_T = k_B × T / q ≈ 25.85 mV
BJT w/ Early Eff.
I_C = I_S×e^(V_BE/V_T) × (1+V_CE/V_A)
Half-Wave Rect.
V_out = max(V_in − V_D, 0)
Inverting Amp
V_out = −(R_f / R_in) × V_in
Non-Inverting
V_out = (1 + R_f/R_in) × V_in
Integrator
V_out = −(1/RC) ∫ V_in dt
Differentiator
V_out = −RC × dV_in/dt
555 Astable f
f = 1.44 / ((R1 + 2×R2) × C)
555 t_H
t_H = 0.693 × (R1 + R2) × C
555 Monostable
t_p = 1.1 × R × C
Clipper Thresh.
V_clip = V_ref ± 0.7 V
DESIGN PRINCIPLES
🎯
Physics First
Every trace comes from a real physical formula — never hand-drawn or approximated.
Zero Dependencies
No simulation libraries, no SPICE wrapper. Pure mathematics in the browser.
🌙
Dark-Mode Native
Designed from the ground up for dark mode — oscilloscope aesthetic with glow traces.
🔁
Live Feedback
Every slider, button, and toggle updates the waveform with no deliberate delay.
📱
Responsive
Sidebar collapses on mobile. Canvas scales to fill available width.
📚
Educational
HUD overlays, formula bars, threshold lines, and region labels teach as you explore.
COMING SOON
RC/RL/LC Filters
Bode plots, freq response
COMING SOON
Digital Logic Gates
AND/OR/NOT/NAND truth tables
COMING SOON
Flip-Flops (SR/D/JK)
Sequential logic, clock pulse
COMING SOON
Phase-Locked Loop
VCO, phase comparator
COMING SOON
Power Supply Design
Regulator, ripple, load regulation
COMING SOON
Transistor Amplifier
Common-emitter, gain, bias point

Ready to explore?

Choose any lab from the navigation sidebar or start with the Diode I-V characteristics.

Start with Diode Lab ← Back to Home