Imagine a big, heavy paddlewheel in the pipe. When water starts to
flow, the wheel is slow to get going. But once it's spinning fast,
it wants to keep spinning — even if you shut the water off.
An inductor is that heavy wheel, for electricity.
) : (
<>
The component with momentum.
A capacitor resists changes in voltage. An inductor is its
mirror image: it resists changes in current. Picture a
heavy paddlewheel — slow to spin up, but once moving it carries the
flow along by sheer momentum.
Physically it's just a coil of wire. Current through it stores energy
in a magnetic field; that field fights any attempt to change the
current quickly.
R, C, and now L — the three passive components. You've met them all.
)}
Slow to start, slow to stop. It hates sudden change.
{kids
? <>Switch the water on and watch the wheel slowly speed up. Switch it off and watch it coast — it doesn't stop right away!
: <>Toggle the source. Current ramps up gradually (not instantly), and when you cut the source it decays rather than snapping to zero. The chart shows the lag.}
{kids ? "Light wheel, heavy wheel" : "Inductance (L)"}.
{kids ? (
A light wheel speeds up fast. A heavy wheel takes longer but coasts
longer too. Drag the slider to change how heavy the wheel is.
) : (
<>
Inductance, measured in henries (H),
is how strongly the coil resists current change — the "heaviness" of
the wheel. More inductance, slower ramp, more stored momentum.
More turns of wire (or an iron core) means more inductance. Named for
Joseph Henry, who discovered it the same time as Faraday.
)}
try it
{kids ? <>Heavier = slower to start and slower to stop.
: <>Watch the chart: bigger L stretches both the spin-up and the coast-down.}
{kids ? <>Flip the power and change the wheel weight. Watch the chart lag behind.
: <>Toggle the drive and vary L. The current curve always lags — that lag is the whole point of an inductor.}
);
}
function spinBtn(active, color) {
return {
appearance: "none",
border: `2px solid ${active ? color : "var(--rule-strong)"}`,
background: active ? color : "transparent",
color: active ? "var(--bg-card)" : "var(--ink)",
padding: "11px 22px", borderRadius: 8, cursor: "pointer",
fontFamily: "'IBM Plex Mono', monospace", fontSize: 13,
letterSpacing: "0.1em", textTransform: "uppercase", fontWeight: 500,
};
}
/* ─── LoopSection9 — the momentum loop (real charges, not the analogy) ─── */
function LoopSection9({ kids }) {
const [driveOn, setDriveOn] = useState(true);
const cur = useInductorSim({ driveOn, L: 2.4, running: true, offFactor: 3.5 });
const ref = useInViewCallback(() => {});
return (
§ the real picture · charges with momentum
{kids ? <>Watch the charges get heavy. : <>The charges themselves have momentum.}
{kids
? <>The paddlewheel was the picture; here are the real charges. Flip the source on — see how they're slow to speed up. Flip it off while they're racing, and watch the gap open up in the wire: the charges refuse to just stop, so they keep shoving — until the push (voltage) gets big enough to leap the gap. That leap is the spark.
: <>Same loop, real charges. Watch the switch itself: opening it doesn't just stop the flow — it breaks the path. The coil won't let current change instantly, so it keeps driving charge at that broken gap, and voltage climbs (right below the current readout) until it's high enough to arc across the air. The spike isn't a side-effect of current falling — it's the coil fighting the cut, and losing that fight looks like a spark.}
{kids
? <>This is the mirror of the bucket: the bucket fought to keep its level, the wheel fights to keep its flow.
: <>The dual of the capacitor: where C resisted a change in voltage, L resists a change in current — storing energy in a magnetic field instead of an electric one.}
{kids
? <>And that spark isn't just for show — it's exactly how a spark plug fires, and exactly what engineers add a little "safety valve" part to tame in motors and relays. Both coming up next.
: <>This spike is never just a curiosity to route around — engines deliberately cut an inductor to fire spark plugs, and every relay/motor driver needs a flyback diode to survive it. Both real circuits, next.}
);
}
/* ─── SpikeSection — cut the current, watch the voltage leap ───────────
Interactive: power a coil, then cut it. A strip-chart shows current
collapsing and the voltage spike it produces. A flyback-diode toggle
tames the spike — chapter 7 meeting chapter 9. Also introduces
E = ½LI² (the energy that has to go SOMEWHERE when you cut). */
function SpikeSection({ kids }) {
const [on, setOn] = useState(true);
const [L, setL] = useState(2);
const [flyback, setFlyback] = useState(false);
const iRef = useRef(0);
const histRef = useRef([]); // [{i, v}]
const [, force] = useState(0);
const onRef = useRef(on); onRef.current = on;
const LRef = useRef(L); LRef.current = L;
const fbRef = useRef(flyback); fbRef.current = flyback;
useEffect(() => {
let raf, last = performance.now(), acc = 0;
const tick = (now) => {
const dt = Math.min(0.05, (now - last) / 1000); last = now;
const Lc = LRef.current;
const tauUp = 0.35 + Lc * 0.30;
// OFF: without a flyback path the field collapses brutally fast;
// with the diode it coasts down gently through the safe loop.
const tauDn = fbRef.current ? 0.22 + Lc * 0.18 : 0.085;
const target = onRef.current ? 1 : 0;
const tau = onRef.current ? tauUp : tauDn;
const di = (target - iRef.current) * (dt / tau);
const v = -Lc * (di / dt) * 0.55; // toy scale for the chart
iRef.current += di;
acc += dt;
if (acc > 0.033) {
acc = 0;
histRef.current.push({ i: iRef.current, v: fbRef.current ? Math.max(-0.16, Math.min(0.16, v)) : Math.max(-4.6, Math.min(4.6, v)) });
if (histRef.current.length > 150) histRef.current.shift();
force(n => n + 1);
}
raf = requestAnimationFrame(tick);
};
raf = requestAnimationFrame(tick);
return () => cancelAnimationFrame(raf);
}, []);
const hist = histRef.current;
const W = 640, H = 270, x0 = 46, x1 = W - 16, yMid = 168, iY0 = 150, iAmp = 92;
const X = (k) => x0 + (k / 149) * (x1 - x0);
const iPts = hist.map((h, k) => `${X(k).toFixed(1)},${(iY0 - h.i * iAmp + 60).toFixed(1)}`).join(" ");
const vPts = hist.map((h, k) => `${X(k).toFixed(1)},${(yMid - h.v * 26).toFixed(1)}`).join(" ");
const iNow = iRef.current;
const energy = 0.5 * L * iNow * iNow * 4; // toy display amps
const sparking = !on && !flyback && hist.length && Math.abs(hist[hist.length - 1].v) > 0.7;
const spikeV = Math.round(12 + L * 90 * Math.min(1, iNow + 0.4));
return (
§ 05½ · cut it and see
Cut the current. Watch it bite.
{kids
? <>Get the wheel spinning, then slam the gate shut. All that motion has to go SOMEWHERE — watch the bottom line of the chart jump!
: <>Build up current, then open the switch. The collapsing field forces a huge voltage across the gap — that's the spike. Then arm the flyback diode and cut again.}
{kids
? <>How big is the slam? It depends on how much oomph the wheel holds:
: <>How much energy is in the slam? Exactly what the field was holding:}
E=½·L·I2
{kids
? <>(Heavier wheel × faster spin = bigger slam. The "²" means speed counts double!)
: <>(Half, times the inductance, times the current squared — the twin of the capacitor's ½CV². Current counts twice: double the flow, four times the stored energy. You'll use this in the practice problems below.)}
try it
{kids ? "flow (top) · kick (bottom)" : "current (top) · voltage across the switch (bottom)"}
{kids ? "oomph stored right now" : "stored energy · ½LI²"}{energy.toFixed(1)} J
{kids
? <>The one-way valve (from the diode chapter!) gives the wheel a little loop to coast in — no slam, no sparks.
: <>Without the diode the spike scales with L and how fast the switch opens — tens to thousands of volts from a 12 V circuit. With it, the energy coasts off gently at ~0.7 V. Chapter 7 saving chapter 9.}
);
}
function WorkedExampleSection({ kids }) {
return (
§ 06 · a real inductor job · the spark
A practical story: the ignition coil.
{kids ? (
<>
A car engine needs a BIG spark to light its fuel — way bigger
than its little battery can make. So how does it do it? With
our stubborn coil!
Watch the loop below: the battery fills the coil with push,
then a switch snaps open. The coil refuses to stop —
and all that push leaps across a tiny gap inside the engine
as a spark. Boom — the fuel lights, the engine runs.
) : (
<>
A car engine needs a spark of tens of thousands of volts to ignite
fuel — but the battery is only 12 V. Where does that huge voltage
come from? An inductor's refusal to let current change suddenly.
Current builds up in a coil. Then a switch abruptly cuts it. The
coil, desperate to keep its current flowing, drives the voltage
sky-high — V = L·(di/dt), and di/dt is enormous when you cut it
fast. That spike jumps the spark-plug gap.
The same trick (storing energy in a magnetic field, then releasing
it) runs the boost converters that step your phone
battery up to drive its screen.
)}
the spike
{kids ? (
<>fill the coil with push → snap the switch open → a giant spark jumps!
) : (
<>V = L · (di/dt)
cut current fast → di/dt is huge → V leaps to 30,000 V
)}
{kids
? <>Here the spark is the WHOLE POINT — the engine wants it. In other machines it's a problem, and the one-way valve tames it (next section!).
: <>That's why you add a flyback diode across coils and motors — to give that surge a safe path instead of frying your switch.}
{kids
? <>The spinning wheel (this chapter) + the one-way valve (chapter 7): together they make — and tame — a spark.
: <>Inductor (Ch 9) + diode (Ch 7): two ideas combine to make and tame a spark.}
{kids ? "watch it fire" : "the whole circuit, firing"}
);
}
const Q_ADULT = [
{ q: "An inductor resists changes in…", kind: "concept", options: ["voltage", "current", "resistance", "temperature"], correct: 1, explain: "Current. It's the mirror of the capacitor, which resists voltage change." },
{ q: "The water analogy for an inductor is a…", kind: "concept", options: ["bucket", "one-way valve", "heavy paddlewheel (momentum)", "pinch"], correct: 2, explain: "A heavy flywheel — slow to spin up, keeps going once moving." },
{ q: "Inductance is measured in…", kind: "concept", options: ["farads", "henries (H)", "ohms", "hertz"], correct: 1, explain: "The henry, after Joseph Henry." },
{ q: "Physically, an inductor is usually just a…", kind: "concept", options: ["pair of plates", "coil of wire", "block of carbon", "crystal"], correct: 1, explain: "A coil — current through it stores energy in a magnetic field." },
{ q: "Abruptly cutting current to an inductor produces a…", kind: "concept", options: ["smooth stop", "large voltage spike", "drop to half", "permanent reversal"], correct: 1, explain: "Current can't change instantly, so voltage spikes (V = L·di/dt) — used in ignition coils." },
{ q: "R, C, and L are the three…", kind: "concept", options: ["power sources", "passive components", "kinds of wire", "logic gates"], correct: 1, explain: "Resistor, capacitor, inductor — the three passive building blocks." },
{
q: "An inductor resists changes in…",
kind: "concept",
options: ["voltage", "current", "temperature", "color"],
correct: 1,
explain: "The flywheel fights changes in FLOW. (The capacitor is its mirror: it fights changes in voltage.)",
},
{
q: "Cut power to a coil suddenly and it…", kind: "concept",
options: ["does nothing", "tries to keep the current going — voltage spikes", "becomes a resistor", "charges up like a battery"],
correct: 1,
explain: "The spinning flywheel doesn't stop on command — it shoves the current onward, spiking the voltage. (That's why relays get flyback diodes.)",
},
{
q: "Capacitor is to voltage as inductor is to…", kind: "concept",
options: ["resistance", "current", "power", "heat"],
correct: 1,
explain: "C stores charge and steadies voltage; L stores momentum and steadies current. Perfect mirrors.",
},
{
q: "Where does the voltage spike energy come from when you cut current to an inductor?",
kind: "concept",
options: [
"It's created from nothing",
"The magnetic field around the coil, collapsing and dumping its stored energy back into the circuit",
"The wire itself heats up and releases it",
"It comes from the switch",
],
correct: 1,
explain: "An inductor stores energy in its magnetic field while current flows. Cut the current and that field collapses, shoving its stored energy back out as a voltage spike — enough to arc across a switch's contacts.",
},
{
q: "Why do relays and motors need a 'flyback diode' across their coil?",
kind: "concept",
options: [
"To make them spin faster",
"To give the collapsing field's spike a safe path, protecting the switch/transistor that drives it",
"To store extra charge",
"To rectify AC",
],
correct: 1,
explain: "Without a return path, the inductor's collapse-spike can be hundreds of volts — enough to destroy a switching transistor. The flyback diode gives that energy somewhere safe to go.",
},
{
q: "A bigger inductor (more henries) means the current…",
kind: "math",
options: ["changes MORE easily", "changes MORE slowly for the same voltage", "is unaffected", "reverses instantly"],
correct: 1,
explain: "V = L·(di/dt) — for a fixed voltage, a bigger L means a smaller rate of current change. More henries, more sluggish.",
},
];
const Q_KIDS = [
{ q: "An inductor is like a heavy…", kind: "concept", options: ["bucket", "spinning wheel", "wall", "balloon"], correct: 1, explain: "A heavy paddlewheel — hard to start, hard to stop!" },
{ q: "When you turn the power on, the wheel speeds up…", kind: "concept", options: ["instantly", "slowly", "never", "backward"], correct: 1, explain: "Slowly — it has momentum, like a real heavy wheel." },
{ q: "When you turn the power off, the wheel…", kind: "concept", options: ["stops instantly", "coasts for a bit", "explodes", "reverses"], correct: 1, explain: "It coasts — it wants to keep going!" },
{ q: "The inductor is the opposite of the…", kind: "concept", options: ["battery", "capacitor (bucket)", "wire", "switch"], correct: 1, explain: "The capacitor stores a push; the inductor stores motion. Opposites!" },
{ q: "A heavier wheel is…", kind: "concept", options: ["faster to change", "slower to change", "the same", "lighter"], correct: 1, explain: "Slower to speed up AND slower to stop." },
{
q: "The heavy waterwheel is hard to…", kind: "concept",
options: ["paint", "start AND stop", "see", "lift"],
correct: 1,
explain: "It resists changes — slow to spin up, and once spinning it doesn't want to stop.",
},
{
q: "When you stop pushing, the spinning wheel…", kind: "concept",
options: ["stops instantly", "keeps the water moving a little longer", "reverses", "disappears"],
correct: 1,
explain: "Its momentum keeps the flow going for a moment — that's what an inductor does.",
},
{
q: "Which pair are opposites-buddies?", kind: "concept",
options: ["bucket and flywheel", "pipe and pipe", "switch and wire", "barrel and barrel"],
correct: 0,
explain: "The bucket (capacitor) smooths the push; the flywheel (inductor) smooths the flow.",
},
{
q: "Where does the extra push come from when you suddenly stop the wheel?",
kind: "concept",
options: ["Nowhere, it's magic", "The wheel's own spinning energy, let out all at once", "The battery makes more", "The wire creates it"],
correct: 1,
explain: "The spinning wheel was storing energy. Stop it suddenly and that energy has to go somewhere — out it comes as a big push!",
},
{
q: "A heavier flywheel changes speed…",
kind: "concept",
options: ["faster", "more slowly", "the same", "never"],
correct: 1,
explain: "More weight (inductance) means more sluggish — slower to speed up, slower to stop.",
},
];
function App() {
const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
useCrossChapterPersistence(t, setTweak);
useEffect(() => { document.body.setAttribute("data-theme", t.theme); }, [t.theme]);
const kids = t.audience === "kids";
const navItems = [
{ id: "cover", label: "Cover" },
{ id: "begin", label: kids ? "Heavy wheel" : "Momentum" },
{ id: "spinup", label: kids ? "On/off" : "Spin up" },
{ id: "inductance", label: kids ? "Weight" : "Inductance" },
{ id: "predict", label: "Predict" },
{ id: "playground", label: "Playground" },
...(kids ? [] : [{ id: "example", label: "The spark" }]),
{ id: "practice", label: "Practice" },
{ id: "quiz", label: "Quiz" },
{ id: "whats-next", label: "What's next" },
];
return (
<>
setTweak("audience", v)} />
The Flywheel.}
chapterSub="Chapter 9 · Inductors & momentum"
kids={kids}
lede={kids
? <>Meet the heavy wheel. An inductor is slow to get going and slow to stop — it gives a circuit momentum, like a spinning wheel that won't quit.
: <>The last passive component. Where a capacitor resists voltage change, an inductor resists current change — storing energy in a magnetic field. The flywheel of electronics.} />
{
const l = rng.pick([1, 2, 0.5, 3]), didt = rng.int(2, 6, 1);
return {
q: { adult: `A ${l} H inductor's current changes at ${didt} A per second. What voltage appears across it?`, kids: `A heavy flywheel of size ${l}, with flow speeding up by ${didt} each second. Push-back = size × how-fast-it-changes.` },
unit: "V", answer: +(l * didt).toFixed(2), tol: 0.04,
hint: "V = L × (di/dt).",
solution: { adult: `V = L × (di/dt) = ${l} H × ${didt} A/s = ${+(l * didt).toFixed(2)} V.`, kids: `${l} × ${didt} = ${+(l * didt).toFixed(2)}.` } };
},
(rng) => {
const l = rng.pick([0.5, 1, 2]), i = rng.int(1, 4, 1);
const e = +(0.5 * l * i * i).toFixed(2);
return {
q: { adult: `How much energy is stored in a ${l} H inductor carrying ${i} A? (Answer in joules.)`, kids: `Energy in a spinning flywheel = ½ × size × flow × flow. Size ${l}, flow ${i}.` },
unit: "J", answer: e, tol: 0.04,
hint: "E = ½ L I².",
solution: { adult: `E = ½ L I² = ½ × ${l} × ${i}² = ${e} J.`, kids: `½ × ${l} × ${i} × ${i} = ${e}.` } };
},
(rng) => {
const l = rng.pick([1, 2, 0.5]), r = rng.pick([50, 100, 200, 250]);
const ms = +(l / r * 1000).toFixed(1);
return {
q: { adult: `A ${l} H inductor sits with a ${r} Ω resistor. What is the L/R time constant? (Answer in milliseconds.)`, kids: `How quickly the flywheel settles = size ÷ pinch. Size ${l}, pinch ${r}. (in thousandths of a second)` },
unit: "ms", answer: ms, tol: 0.05,
hint: "\u03c4 = L ÷ R, then ×1000 for ms.",
solution: { adult: `\u03c4 = L ÷ R = ${l} ÷ ${r} = ${+(l / r).toFixed(4)} s = ${ms} ms.`, kids: `${l} ÷ ${r} = ${ms} thousandths.` } };
},
]} />
{kids
? <>Try it: open The Sandbox and load “Inductor (RL)” — watch the charges start slow and speed up, because the heavy wheel hates a sudden change. Then try “LC oscillator” and see the flow swing back and forth.
: <>See it move: in The Sandbox, the RL example shows current ramping in (the inductor opposing the change); LC rings as energy sloshes L↔C, and RLC shows that ringing damp away. Probe a node to scope it.}
You've met the heavy wheel — and now all the parts! Next, we put them together into something that blinks: the 555 timer.
: <>R, C, and L — you now know all three passive components, plus diodes, transistors, and AC. Next we combine them into a working oscillator: the 555 timer.}
prevHref="chapter8.html" prevLabel="Chapter 8"
nextHref="chapter10.html" nextLabel="Chapter 10 · The Blinker" />
);
}
ReactDOM.createRoot(document.getElementById("root")).render();