Full-night hypnogram: N1, N2, N3, REM across 4-5 cycles; deep sleep front-loaded, REM expands toward morning.
A free, animated sleep hypnogram: five stages across the night you can read here or embed on any website, from Scrollchart.
Sleep Hypnogram: Five Stages Across the Night
You cycle through light, deep, and REM sleep about 5 times per night. Deep sleep dominates the early hours for physical repair, while REM sleep grows longer toward morning for brain processing.
N1 (Light)
N2 (Medium)
N3 (Deep)
REM
A hypnogram plots sleep stage on the Y axis against clock time across a full night. Five distinct lanes run from Awake at the top down through REM, N1 (light), N2 (intermediate), and N3 (deep slow-wave) at the bottom. The trace steps between lanes as the sleeper cycles through them, creating the characteristic staircase pattern.
In a healthy adult, the first half of the night is dominated by deep N3 sleep: the first cycle typically delivers the largest and longest N3 bout, where growth hormone (GH) is secreted in its largest daily pulse. Later cycles progressively shorten N3 and lengthen REM, so by cycles 4 and 5 the trace barely dips below N2 and spends up to 40-45 minutes in REM.
N3 (slow-wave sleep) is driven by sleep pressure (adenosine accumulation) and is when the brain downscales synaptic weights, the glymphatic system clears metabolites including amyloid-beta, and growth hormone peaks. It is preferentially lost with age, poor sleep hygiene, and alcohol.
REM sleep is controlled by circadian pacemaker signals from the SCN and is characterized by theta oscillations, muscle atonia, and vivid dreams. Memory consolidation for emotional and procedural content occurs primarily here. The lengthening of REM in later cycles means that cutting the last 1-2 hours of sleep disproportionately eliminates REM.
The two-process model of sleep regulation (Borbely 1982) explains hypnogram shape: Process S (homeostatic, adenosine-driven) rises during wake and falls during sleep; Process C (circadian alerting signal) oscillates with a 24-hour period. Their interaction determines when each stage fires.
GH pulse timing to first N3 was established by Van Cauter and colleagues and is highly reproducible in healthy young adults. Disruption of N3 (e.g., by acoustic fragmentation) proportionally blunts the GH pulse.
A two process model of sleep regulation , Borbely AA (1982)
Sleep and GH secretion in young men , Van Cauter E et al. (2000)
Good for
Sleep-tracker explainer pages
GH/testosterone supplement stack articles
Why-do-we-need-sleep educational content
Insomnia and sleep-quality product landing pages
Source & accuracy
Dijk DJ & Czeisler CA, J Neurosci 1995; Van Cauter E et al., Sleep 2000 (GH pulse)
Reading the staircase shape of a hypnogram
A hypnogram plots sleep stage on the vertical axis against time across the night. Wake sits at the top, then N1 and N2 below it, with N3 (deep slow wave sleep) at the bottom and REM drawn as its own band. The result looks like an irregular descending and ascending staircase repeating four to five times.
Each descent into N3 and rise toward REM marks one cycle of roughly 90 minutes.
How the pattern changes from dusk to dawn
Early cycles dip deepest, so the largest blocks of N3 appear in the first third of the night. As morning approaches, the trace spends less time in deep sleep and the REM bands grow wider and more frequent.
Clinicians read hypnograms from sleep studies to spot fragmentation, reduced deep sleep, or abnormal REM timing, but interpreting an individual study should be left to a qualified sleep professional. General educational information only.
Embed this diagram
Add this animated sleep hypnogram: five stages across the night 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 sleep hypnogram: five stages across the night for any website.
Who uses it
Health blogs, Wellness sites, Biohacker blogs, Medical educators.
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.
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.
By embedding, you acknowledge the diagram and explainer text are served from scrollchart.com and may be updated from time to time to reflect new research or to link to relevant sources within the explainer.
Frequently asked questions
Where can I get a free animated "Sleep Hypnogram: Five Stages Across the Night" for my website?
Scrollchart provides "Sleep Hypnogram: Five Stages Across the Night" 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 sleep hypnogram: five stages across the night 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.