Skip to content
Supplements Medium #electrolytes#sodium#potassium

Sodium, Potassium, Magnesium Balance

The three electrolytes that keep nerves firing, muscles contracting, and pressure regulated.

A free, animated sodium, potassium, magnesium balance you can read here or embed on any website, from Scrollchart.

Sodium, Potassium, Magnesium Balance

Sodium, Potassium, Magnesium BalanceNa/K ATPase burns roughly 25% of resting ATP to maintain ion gradients across every cellExtracellularIntracellularcell membrane (lipid bilayer)Na+140 mEq/LHIGH outsideK+4 mEq/Llow outsideK+140 mEq/LHIGH insideNa+14 mEq/LMg2+0.8 mMintracellularNa/KATPase3 Na+ out / 2 K+ in3 Na+ out2 K+ inATP -> ADP + PiWhat the gradient powersAction potentialNa+ inrush depolarizes nerves and muscleMuscle contractionK+ efflux repolarizes; Mg2+ relaxesCell volume + BPOsmotic balance; aldosterone retains Na+TargetsNa+ ~2.3 g/day, K+ 3.5-4.7 g/day, Mg2+ 320-420 mg/dayAthletes lose 0.5-2 g Na+ per litre sweat; cramps often signal Na+ or Mg2+ deficit, not K+

Cellular ion gradients: Na+ outside, K+ inside, Mg2+ intracellular. Na/K ATPase maintains the gradient. Action potentials, muscle contraction, and cellular volume all depend on the balance.

Good for

  • Electrolyte mechanism explainers
  • Hydration and cramp articles for endurance athletes
  • Hypertension and sodium-potassium balance content

Source & accuracy

This sodium, potassium, magnesium balance is an editorial illustration built to represent the concept accurately. Where it shows figures, they are typical or representative values chosen to make the relationship clear, not a single underlying dataset. The diagram and its explainer are reviewed and maintained centrally, and updated over time as understanding improves.

How the sodium-potassium pump sets the resting potential

The Na/K-ATPase pump sits in the cell membrane and uses energy from ATP to push sodium ions out of the cell and potassium ions in, moving each against its concentration gradient. The result is high sodium outside and high potassium inside, an electrochemical imbalance that the cell maintains continuously. This stored difference creates the negative resting membrane potential found in nerve and muscle cells.

Because the pump moves three sodium out for every two potassium in, it also contributes directly to the charge separation, making it both a gradient builder and a small generator of membrane voltage.

Turning the gradient into nerve and muscle signals

The gradients the pump maintains are the stored energy that nerve impulses and muscle contractions draw on. When a cell is triggered, channels open and ions rush down these gradients, briefly reversing the membrane voltage to produce an action potential, after which the pump restores the resting state. This cycle underlies every heartbeat, movement, and nerve signal.

Disturbances in sodium or potassium levels can therefore affect nerve and muscle function. This is general educational information, not medical advice; electrolyte abnormalities can be serious and should be assessed by a qualified professional.

Embed this diagram

Add this animated sodium, potassium, magnesium balance to your own site. Copy one line of HTML, or use the embed builder for theme and sizing options.

Reference

What this is
A free, embeddable, animated sodium, potassium, magnesium balance for any website.
Who uses it
Supplement reviewers, Health blogs, Fitness blogs, Wellness sites.
How to embed
Copy one line of HTML. No signup. No watermark. Works in WordPress, Webflow, Ghost, Substack, plain HTML.
File size
iframe embed, ~80 KB gzipped (loads on demand, does not block your page paint).
License
Free forever. Editorial explainer text included; updated centrally over time.

Embed format options

Copy the universal HTML snippet, the WordPress shortcode, or an iframe fallback - see the WordPress plugin page for details. Any format keeps the same Core Web Vitals profile and the same explainer text.

Embed snippet
<div data-scrollchart="electrolyte-balance" data-scrollchart-v="1"></div>
<script src="https://scrollchart.com/embed.js" async></script>

Frequently asked questions

Where can I get a free animated "Sodium, Potassium, Magnesium Balance" for my website?
Scrollchart provides "Sodium, Potassium, Magnesium Balance" as a free, embeddable animated diagram you can add to any website with one line of HTML. No signup is required and there is no watermark. The diagram and its explainer text are served from scrollchart.com, so the embed stays current without any maintenance on your end.
How do I embed a sodium, potassium, magnesium balance diagram in a health or wellness blog?
Copy the HTML snippet from the Scrollchart diagram page and paste it into any post or page in your CMS. It works in WordPress, Webflow, Ghost, Substack, and plain HTML without any plugin or account. The diagram renders as animated SVG directly in your page, so search engines can index the accompanying explainer text.