Interactive Biology Visualizations

Hard-to-picture biology, brought to life. Each page is a hands-on, animated diagram built in JavaScript — press play, slow it down, trigger the process yourself, and watch how a part of the human body actually works, with live readouts in real units. Made for students, patients, and the curious.

Thirty-two systems — pick one below and everything moves.

Cells & Energy
🔋

Mitochondria & ATP

Watch electrons flow through the electron transport chain, protons get pumped, and the ATP-synthase motor spin as your cells make energy — then block Complex IV with cyanide and see the whole chain stall.

Launch animation →
🧬

DNA → Protein

Unzip DNA in the nucleus, transcribe it into mRNA, then step codon by codon as the ribosome matches tRNA anticodons and links amino acids into a protein.

Launch animation →
🔄

The Methylation Cycle

Hand a methyl group from folate to B12 to homocysteine and back — then knock out B12 and watch the folate trap slam shut while homocysteine climbs.

Launch animation →
💥

Free Radicals & Your Antioxidant Network

Follow one superoxide radical down the whole relay — SOD, catalase, glutathione, vitamin E, vitamin C, NADPH. Then release free iron and watch the Fenton reaction tear a membrane apart.

Launch animation →
Heart, Blood & Breath
❤️

The Heart & Circulation

Trace a blood cell through all four chambers and both circuits, changing colour from blue to red in the lungs — with a live ECG, chamber pressures, and an exercise mode.

Launch animation →
🩺

Blood Pressure Control

Watch the kidney fire renin, angiotensin clamp the arteries, and aldosterone hold on to sodium — then eat salt, get dehydrated, or take an ACE inhibitor.

Launch animation →
🧈

Cholesterol & the Artery Wall

Follow LDL particles into the artery wall and watch foam cells build a plaque — then add a statin and see the liver's receptors pull them back out.

Launch animation →
🫁

Breathing & Gas Exchange

Move the diaphragm, fill the alveoli, and watch oxygen diffuse into the blood while carbon dioxide leaves — with live pO₂/pCO₂ meters and an exercise mode.

Launch animation →
🩹

How Blood Clots

Cut the vessel and watch platelets plug it while the coagulation cascade explodes into a fibrin mesh — then take warfarin and see the vitamin-K factors go dark one by one.

Launch animation →
🧲

Iron & the Hepcidin Gate

Watch vitamin C unlock plant iron and hepcidin slam the gate shut — then add inflammation and see why a high ferritin can still mean too little usable iron.

Launch animation →
Hormones & Metabolism
🩸

Blood Sugar & Insulin

Eat a meal and watch insulin escort glucose into cells, the liver bank glycogen, and the blood-glucose curve rise and fall — then switch on insulin resistance.

Launch animation →
🦋

How Your Thyroid Is Controlled

Run the TSH feedback loop, convert T4 into T3, and set your metabolic rate — then switch on Hashimoto's, Graves', or iodine deficiency and watch the labs move.

Launch animation →
🧠

The Stress Response & Cortisol

Fire a stressor: adrenaline spikes in a second, cortisol follows in minutes — then compare an acute stressor with chronic stress and watch the feedback loop blunt.

Launch animation →
🌙

Sleep Stages & Your Body Clock

Run a whole night of deep sleep and REM — then add late-night light, an afternoon coffee, or a nightcap, and watch which parts of the night disappear.

Launch animation →
🍽️

Hunger, Leptin & Why Diets Fight Back

Watch the hunger neurons and the fullness neurons fight it out — then lose weight and see leptin fall, hunger climb, and metabolism drop. It isn't willpower. It's a defended system.

Launch animation →
Nerves & Senses

Nerve Impulse

Fire an action potential and watch it race down the axon — sodium rushing in, potassium out, a live voltage trace spiking, and neurotransmitter crossing the synapse.

Launch animation →

Caffeine, Adenosine & Why Coffee Stops Working

Caffeine doesn't give you energy — it blocks the tiredness signal while it keeps piling up behind the blockade. Move your coffee to 2 p.m. and watch your deep sleep disappear.

Launch animation →
👁️

Vision & the Retina

Focus light through the lens onto an inverted retinal image, then follow the phototransduction cascade as rods and cones react — dim the lights and watch the eye adapt.

Launch animation →
👂

Hearing & the Cochlea

Send a sound wave through the eardrum and ossicles into the cochlea, and slide the frequency to see the traveling wave peak land on its tonotopic place.

Launch animation →
Gut, Liver, Kidney, Muscle & Bone
🍲

Digestion

Send a meal down the tract and watch enzymes and acid break carbs, protein and fat into absorbable units — with a pH meter that shifts from stomach to intestine.

Launch animation →
🦠

The Gut Barrier & Microbiome

Ferment fibre into butyrate and watch it tighten the gut wall — then starve the microbes of fibre and see them start eating your mucus layer instead.

Launch animation →
🫀

How the Liver Detoxifies

Watch Phase I make a toxin more reactive and Phase II neutralise it — and see exactly why a juice cleanse changes nothing at all.

Launch animation →
🍺

What Alcohol Does Inside Your Liver

Ethanol becomes acetaldehyde becomes acetate — and the NADH that piles up shuts down fat burning, stalls your blood sugar and drives up uric acid. Nothing speeds it up. Nothing.

Launch animation →
🫘

Kidney Nephron

Follow blood into the glomerulus and see filtration and reabsorption turn 180 litres of filtrate into urine — then toggle dehydration or diabetes and watch it change.

Launch animation →
💪

Muscle Contraction

Release calcium, expose the actin binding sites, and watch myosin heads ratchet through the cross-bridge cycle to slide the filaments and shorten the sarcomere.

Launch animation →
🦴

Bone Remodeling & Calcium

Watch osteoclasts tunnel and osteoblasts rebuild — then drop vitamin D and see PTH quietly strip calcium out of your skeleton to defend the blood level.

Launch animation →
Vitamins & Minerals at Work
☀️

Vitamin D: From Sunlight to Hormone

Fire UVB photons at your skin and follow the molecule through the liver and kidney into an actual steroid hormone that walks into the nucleus and switches genes on.

Launch animation →
💊

Vitamin B12's Impossible Journey

Five stages, two carrier proteins, a working stomach, a working pancreas and one specific stretch of gut. Break any link — a PPI, metformin, pernicious anaemia — and absorption collapses.

Launch animation →
🍊

Vitamin C, Collagen & Why Sailors Fell Apart

Zip three protein chains into the strongest rope in biology — then take the vitamin C away and watch the helix unravel, and old, healed scars split back open.

Launch animation →
🧲

Magnesium: The Mineral That Makes ATP Work

Bare ATP is useless — enzymes reject it. Watch magnesium clamp the phosphates and switch it on, plug the NMDA channel, and let a cramping muscle finally let go.

Launch animation →
Defence & Repair
🛡️

Immune Response

Inject a pathogen and watch innate cells swarm, T cells activate B cells, and antibodies rise — then vaccinate and compare the fast, strong secondary response.

Launch animation →
🔥

Inflammation: The Cascade and How It Resolves

Cut the tissue and watch NF-κB light the fire, neutrophils swarm and CRP climb — then discover that resolution is an active programme driven by omega-3 resolvins, not the fire simply burning out.

Launch animation →

Why animated?

Textbook diagrams freeze a moving process into a single still frame — and biology is almost never still. Energy production, blood flow, filtration, and nerve signals are all processes, defined by what moves where and when. These visualizations let you press play, slow the speed down, and see cause and effect unfold, which is how the brain actually builds an intuition for a mechanism. More visualizations are added over time.

How to read them

Every page works the same way. Pause and Speed are always in the top-left. The scenario buttons are the interesting part — they let you break the mechanism on purpose and watch what fails, which is usually the fastest way to understand why the healthy version is built the way it is. The panel on the right shows live numbers in real clinical units, and each page says plainly which figures are real measured values and which are an illustrative model. Below every animation there is a full plain-language article, written for patients rather than clinicians.

These pages are free, carry no advertising, and are not a substitute for medical advice. They exist because understanding how your own body works should not cost anything.