React chart example

Cohort heatmap

Compare groups at the same stage after a shared starting event, with colour revealing patterns over elapsed time.

Try a theme
Chart options

Options apply to compatible charts.

Data density

Synthetic sample data · Retention for 8 cohorts across 8 weeks.

Loading chart…

What is a cohort heatmap?

A cohort heatmap compares groups that share a starting event, such as signup, across the time elapsed since that event. Each cell represents a group at a particular age. Colour encodes a measure such as retention, making repeated patterns and differences between cohorts easier to scan.

When to use it

Use it to compare retention, repeat purchasing or continued product use across signup groups. Elapsed time is the key: compare groups at the same age, not simply on the same calendar date. A regular time-series chart is better when the question concerns overall activity on a specific day.

Design tips

  • Define the cohort rule, retained event and denominator. “Week 4 retention” is ambiguous unless readers know what counts as retained and which starting population is used.

  • Use the same colour scale for comparisons. Automatic rescaling between views can make equally retained groups look different.

  • Keep not-yet-observed periods distinct from zero retention. Recent cohorts may simply not have reached later weeks. Include cohort sizes when interpreting real results.

Build this chart in React

Graphy Chart SDK

Add Graphy’s cohort heatmaps to your React app.

Ship quickly with one maintained SDK, without building and maintaining the entire charting experience yourself.

2026 Graphy Technologies Ltd. All rights reserved.

2026 Graphy Technologies Ltd. All rights reserved.

2026 Graphy Technologies Ltd. All rights reserved.