Skip to content
Nutrition Medium #body-composition#lean-mass#fat-mass

Body Composition Buckets

Fat mass, skeletal muscle, organ + bone, water. Two people at the same weight can look entirely different.

A free, animated body composition buckets you can read here or embed on any website, from Scrollchart.

Body Composition Buckets

Body Composition Buckets

Stacked composition bars for two 80kg individuals: one at 15% bodyfat with high lean mass, one at 30% bodyfat with low lean mass. Each bar breaks down into fat, skeletal muscle, organ tissue, bone mineral, and total body water. The visual makes the "weight is not composition" point intuitively.

Good for

  • Articles on why scale weight misleads
  • Recomp educational content
  • Body-composition-vs-BMI pieces

Source & accuracy

This body composition buckets 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.

What body weight is actually made of

Total body weight is the sum of several compartments. Fat mass includes essential fat needed for normal function plus storage fat. Skeletal muscle is the contractile tissue that moves the body. Organs and bone make up a substantial fixed share, and body water, both inside and outside cells, is often the single largest component by mass.

Because these compartments differ in density and function, weight alone is a blunt summary. A simple model splits the body into fat mass and fat-free mass, while finer models separate muscle, bone, and water.

Why same weight can look different

Muscle is denser than fat, so it occupies less volume per kilogram. Two people at identical body weight and height can therefore look very different depending on how much of that weight is muscle versus fat. This is also why the scale alone can be misleading during training: muscle gain and fat loss can offset each other, holding weight steady while shape changes.

Water shifts add further day-to-day noise to the scale. This is general educational information, not medical advice.

Embed this diagram

Add this animated body composition buckets 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 body composition buckets for any website.
Who uses it
Nutrition blogs, Fitness blogs, Weight-loss sites, Health blogs.
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="body-composition-buckets" data-scrollchart-v="1"></div>
<script src="https://scrollchart.com/embed.js" async></script>

Frequently asked questions

Where can I get a free animated "Body Composition Buckets" for my website?
Scrollchart provides "Body Composition Buckets" 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 body composition buckets 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.