Skip to content
Statistics Simple #normal#bell-curve#percentile

"You Are Here" Bell Curve

A normal distribution with a position marker and flag label showing where a specific value falls in the distribution.

A free, animated "you are here" bell curve you can read here or embed on any website, from Scrollchart.

"You Are Here" Bell Curve

Where Do You Fit?

A Gaussian bell curve with fill area, a dashed vertical marker dropping from a flag box labeled "You are here", and a metric callout (e.g., "Top 25%") appearing after the marker animates down.

Good for

  • Articles in the statistics category
  • Editorial pages where a quick visual replaces a wall of text
  • Content-marketing posts that need a clean, branded illustration

Source & accuracy

This "you are here" bell curve 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.

Locating individual scores in a distribution

A 'you are here' bell curve overlays a position marker on a normal distribution to show where a specific observation falls relative to the population. A vertical line, arrow, or label flag pinpoints the value and often notes its percentile rank or z-score. This visual approach immediately conveys standing without requiring numerical interpretation.

This format is commonly used in educational testing (percentile reporting), performance evaluations, and survey results, where communicating an individual's standing against a reference population is the goal. Personal genomics reports, credit score ranges, and fitness tracking apps all employ this pattern.

Percentile rank and interpretability

The diagram pairs visual position with a numerical percentile, helping the audience understand what 'above average' or 'below average' actually means in quantitative terms. A score at the 75th percentile is immediately understood to outrank 75 percent of the population. Numbers alone (like an IQ of 120) mean little without context; percentile framing fixes that.

The normal curve backdrop also communicates the expected distribution shape, so outliers or unusual skew become visible. This dual encoding (visual position plus percentile) reduces misinterpretation compared to score-only reporting. The brain processes spatial position and numerical rank together, making the message stick more effectively.

Embed this diagram

Add this animated "you are here" bell curve 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 "you are here" bell curve for any website.
Who uses it
Data journalists, Researchers & academics, Content marketers, News organizations.
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="you-are-here-bell-curve" data-scrollchart-v="1"></div>
<script src="https://scrollchart.com/embed.js" async></script>

Frequently asked questions

Where can I get a free animated ""You Are Here" Bell Curve" for my website?
Scrollchart provides ""You Are Here" Bell Curve" 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 "you are here" bell curve in a blog post or article?
Paste the one-line HTML snippet from the Scrollchart diagram page into your post editor. It works in WordPress, Webflow, Ghost, and plain HTML with no plugin required. The animated diagram and its explainer text load from scrollchart.com and render directly in your page DOM.