Stats & Numbers
Heatmap Calendar
A GitHub-style year grid of daily activity — commits, workouts, orders, logins, anything with one value per day — shaded by a five-step intensity legend so density reads at a glance. Scrolls inside its own container, so a full year never breaks the page layout on mobile.
$ velocityx add heatmap-calendar Built for astro.
Full docs for Heatmap Calendar →
Needs a licence key —
subscribe here, then
velocityx loginonce.
| Date | orders |
|---|---|
| Jan 1, 2026 | 5 |
| Jan 2, 2026 | 4 |
| Jan 3, 2026 | 3 |
| Jan 4, 2026 | 2 |
| Jan 5, 2026 | 6 |
| Jan 6, 2026 | 6 |
| Jan 7, 2026 | 4 |
| Jan 8, 2026 | 1 |
| Jan 9, 2026 | 0 |
| Jan 10, 2026 | 1 |
| Jan 11, 2026 | 1 |
| Jan 12, 2026 | 8 |
| Jan 13, 2026 | 6 |
| Jan 14, 2026 | 5 |
| Jan 15, 2026 | 3 |
| Jan 16, 2026 | 2 |
| Jan 17, 2026 | 0 |
| Jan 18, 2026 | 3 |
| Jan 19, 2026 | 7 |
| Jan 20, 2026 | 7 |
| Jan 21, 2026 | 4 |
| Jan 22, 2026 | 2 |
| Jan 23, 2026 | 7 |
| Jan 24, 2026 | 0 |
| Jan 25, 2026 | 2 |
| Jan 26, 2026 | 8 |
| Jan 27, 2026 | 6 |
| Jan 28, 2026 | 1 |
| Jan 29, 2026 | 3 |
| Jan 30, 2026 | 5 |
| Jan 31, 2026 | 0 |
| Feb 1, 2026 | 1 |
| Feb 2, 2026 | 4 |
| Feb 3, 2026 | 6 |
| Feb 4, 2026 | 2 |
| Feb 5, 2026 | 4 |
| Feb 6, 2026 | 0 |
| Feb 7, 2026 | 2 |
| Feb 8, 2026 | 2 |
| Feb 9, 2026 | 5 |
| Feb 10, 2026 | 6 |
| Feb 11, 2026 | 7 |
| Feb 12, 2026 | 7 |
| Feb 13, 2026 | 2 |
| Feb 14, 2026 | 3 |
| Feb 15, 2026 | 1 |
| Feb 16, 2026 | 7 |
| Feb 17, 2026 | 1 |
| Feb 18, 2026 | 7 |
| Feb 19, 2026 | 2 |
| Feb 20, 2026 | 0 |
| Feb 21, 2026 | 1 |
| Feb 22, 2026 | 0 |
| Feb 23, 2026 | 1 |
| Feb 24, 2026 | 7 |
| Feb 25, 2026 | 2 |
| Feb 26, 2026 | 3 |
| Feb 27, 2026 | 5 |
| Feb 28, 2026 | 2 |
| Mar 1, 2026 | 2 |
| Mar 2, 2026 | 6 |
| Mar 3, 2026 | 5 |
| Mar 4, 2026 | 5 |
| Mar 5, 2026 | 1 |
| Mar 6, 2026 | 2 |
| Mar 7, 2026 | 0 |
| Mar 8, 2026 | 3 |
| Mar 9, 2026 | 8 |
| Mar 10, 2026 | 2 |
| Mar 11, 2026 | 7 |
| Mar 12, 2026 | 2 |
| Mar 13, 2026 | 3 |
| Mar 14, 2026 | 0 |
| Mar 15, 2026 | 0 |
| Mar 16, 2026 | 1 |
| Mar 17, 2026 | 3 |
| Mar 18, 2026 | 4 |
| Mar 19, 2026 | 8 |
| Mar 20, 2026 | 3 |
| Mar 21, 2026 | 1 |
| Mar 22, 2026 | 1 |
| Mar 23, 2026 | 5 |
| Mar 24, 2026 | 3 |
| Mar 25, 2026 | 0 |
| Mar 26, 2026 | 6 |
| Mar 27, 2026 | 3 |
| Mar 28, 2026 | 2 |
| Mar 29, 2026 | 1 |
| Mar 30, 2026 | 5 |
| Mar 31, 2026 | 4 |
| Apr 1, 2026 | 6 |
| Apr 2, 2026 | 5 |
| Apr 3, 2026 | 4 |
| Apr 4, 2026 | 1 |
| Apr 5, 2026 | 1 |
| Apr 6, 2026 | 0 |
| Apr 7, 2026 | 3 |
| Apr 8, 2026 | 4 |
| Apr 9, 2026 | 2 |
| Apr 10, 2026 | 8 |
| Apr 11, 2026 | 2 |
| Apr 12, 2026 | 2 |
| Apr 13, 2026 | 1 |
| Apr 14, 2026 | 8 |
| Apr 15, 2026 | 5 |
| Apr 16, 2026 | 5 |
| Apr 17, 2026 | 1 |
| Apr 18, 2026 | 0 |
| Apr 19, 2026 | 2 |
| Apr 20, 2026 | 5 |
| Apr 21, 2026 | 4 |
| Apr 22, 2026 | 6 |
| Apr 23, 2026 | 5 |
| Apr 24, 2026 | 7 |
| Apr 25, 2026 | 1 |
| Apr 26, 2026 | 0 |
| Apr 27, 2026 | 4 |
| Apr 28, 2026 | 1 |
| Apr 29, 2026 | 7 |
| Apr 30, 2026 | 3 |
| May 1, 2026 | 6 |
| May 2, 2026 | 2 |
| May 3, 2026 | 0 |
| May 4, 2026 | 1 |
| May 5, 2026 | 4 |
| May 6, 2026 | 4 |
| May 7, 2026 | 8 |
| May 8, 2026 | 0 |
| May 9, 2026 | 3 |
| May 10, 2026 | 3 |
| May 11, 2026 | 5 |
| May 12, 2026 | 5 |
| May 13, 2026 | 4 |
| May 14, 2026 | 4 |
| May 15, 2026 | 4 |
| May 16, 2026 | 1 |
| May 17, 2026 | 1 |
| May 18, 2026 | 1 |
| May 19, 2026 | 3 |
| May 20, 2026 | 8 |
| May 21, 2026 | 5 |
| May 22, 2026 | 2 |
| May 23, 2026 | 2 |
| May 24, 2026 | 1 |
| May 25, 2026 | 6 |
| May 26, 2026 | 7 |
| May 27, 2026 | 2 |
| May 28, 2026 | 1 |
| May 29, 2026 | 4 |
| May 30, 2026 | 2 |
| May 31, 2026 | 2 |
| Jun 1, 2026 | 2 |
| Jun 2, 2026 | 6 |
| Jun 3, 2026 | 8 |
| Jun 4, 2026 | 1 |
| Jun 5, 2026 | 0 |
| Jun 6, 2026 | 1 |
| Jun 7, 2026 | 1 |
| Jun 8, 2026 | 4 |
| Jun 9, 2026 | 2 |
| Jun 10, 2026 | 6 |
| Jun 11, 2026 | 2 |
| Jun 12, 2026 | 0 |
| Jun 13, 2026 | 1 |
| Jun 14, 2026 | 1 |
| Jun 15, 2026 | 0 |
| Jun 16, 2026 | 7 |
| Jun 17, 2026 | 0 |
| Jun 18, 2026 | 7 |
| Jun 19, 2026 | 1 |
| Jun 20, 2026 | 2 |
| Jun 21, 2026 | 1 |
| Jun 22, 2026 | 6 |
| Jun 23, 2026 | 3 |
| Jun 24, 2026 | 3 |
| Jun 25, 2026 | 4 |
| Jun 26, 2026 | 3 |
| Jun 27, 2026 | 2 |
| Jun 28, 2026 | 2 |
| Jun 29, 2026 | 5 |
| Jun 30, 2026 | 3 |
| Jul 1, 2026 | 2 |
| Jul 2, 2026 | 5 |
| Jul 3, 2026 | 6 |
| Jul 4, 2026 | 3 |
| Jul 5, 2026 | 1 |
| Jul 6, 2026 | 0 |
| Jul 7, 2026 | 1 |
| Jul 8, 2026 | 7 |
| Jul 9, 2026 | 4 |
| Jul 10, 2026 | 5 |
| Jul 11, 2026 | 3 |
| Jul 12, 2026 | 2 |
| Jul 13, 2026 | 7 |
| Jul 14, 2026 | 7 |
| Jul 15, 2026 | 0 |
| Jul 16, 2026 | 3 |
| Jul 17, 2026 | 3 |
| Jul 18, 2026 | 0 |
| Jul 19, 2026 | 1 |
| Jul 20, 2026 | 5 |
| Jul 21, 2026 | 5 |
| Jul 22, 2026 | 7 |
| Jul 23, 2026 | 5 |
| Jul 24, 2026 | 5 |
| Jul 25, 2026 | 0 |
| Jul 26, 2026 | 2 |
| Jul 27, 2026 | 5 |
| Jul 28, 2026 | 2 |
| Jul 29, 2026 | 1 |
| Jul 30, 2026 | 1 |
| Jul 31, 2026 | 0 |
| Aug 1, 2026 | 1 |
| Aug 2, 2026 | 2 |
| Aug 3, 2026 | 1 |
| Aug 4, 2026 | 1 |
| Aug 5, 2026 | 5 |
| Aug 6, 2026 | 1 |
| Aug 7, 2026 | 1 |
| Aug 8, 2026 | 0 |
| Aug 9, 2026 | 0 |
| Aug 10, 2026 | 7 |
| Aug 11, 2026 | 6 |
| Aug 12, 2026 | 3 |
| Aug 13, 2026 | 3 |
| Aug 14, 2026 | 5 |
| Aug 15, 2026 | 1 |
| Aug 16, 2026 | 2 |
| Aug 17, 2026 | 7 |
| Aug 18, 2026 | 5 |
| Aug 19, 2026 | 3 |
| Aug 20, 2026 | 0 |
| Aug 21, 2026 | 0 |
| Aug 22, 2026 | 0 |
| Aug 23, 2026 | 1 |
| Aug 24, 2026 | 4 |
| Aug 25, 2026 | 1 |
| Aug 26, 2026 | 6 |
| Aug 27, 2026 | 6 |
| Aug 28, 2026 | 3 |
| Aug 29, 2026 | 0 |
| Aug 30, 2026 | 1 |
| Aug 31, 2026 | 3 |
| Sep 1, 2026 | 6 |
| Sep 2, 2026 | 1 |
| Sep 3, 2026 | 5 |
| Sep 4, 2026 | 7 |
| Sep 5, 2026 | 1 |
| Sep 6, 2026 | 3 |
| Sep 7, 2026 | 1 |
| Sep 8, 2026 | 6 |
| Sep 9, 2026 | 1 |
| Sep 10, 2026 | 8 |
| Sep 11, 2026 | 4 |
| Sep 12, 2026 | 2 |
| Sep 13, 2026 | 1 |
| Sep 14, 2026 | 5 |
| Sep 15, 2026 | 6 |
| Sep 16, 2026 | 8 |
| Sep 17, 2026 | 1 |
| Sep 18, 2026 | 1 |
| Sep 19, 2026 | 2 |
| Sep 20, 2026 | 1 |
| Sep 21, 2026 | 3 |
| Sep 22, 2026 | 2 |
| Sep 23, 2026 | 5 |
| Sep 24, 2026 | 1 |
| Sep 25, 2026 | 2 |
| Sep 26, 2026 | 2 |
| Sep 27, 2026 | 1 |
| Sep 28, 2026 | 2 |
| Sep 29, 2026 | 4 |
| Sep 30, 2026 | 4 |
| Oct 1, 2026 | 1 |
| Oct 2, 2026 | 5 |
| Oct 3, 2026 | 2 |
| Oct 4, 2026 | 2 |
| Oct 5, 2026 | 0 |
| Oct 6, 2026 | 7 |
| Oct 7, 2026 | 7 |
| Oct 8, 2026 | 6 |
| Oct 9, 2026 | 5 |
| Oct 10, 2026 | 1 |
| Oct 11, 2026 | 0 |
| Oct 12, 2026 | 7 |
| Oct 13, 2026 | 5 |
| Oct 14, 2026 | 8 |
| Oct 15, 2026 | 2 |
| Oct 16, 2026 | 5 |
| Oct 17, 2026 | 1 |
| Oct 18, 2026 | 3 |
| Oct 19, 2026 | 7 |
| Oct 20, 2026 | 5 |
| Oct 21, 2026 | 0 |
| Oct 22, 2026 | 5 |
| Oct 23, 2026 | 8 |
| Oct 24, 2026 | 0 |
| Oct 25, 2026 | 0 |
| Oct 26, 2026 | 5 |
| Oct 27, 2026 | 1 |
| Oct 28, 2026 | 7 |
| Oct 29, 2026 | 2 |
| Oct 30, 2026 | 5 |
| Oct 31, 2026 | 2 |
| Nov 1, 2026 | 2 |
| Nov 2, 2026 | 4 |
| Nov 3, 2026 | 2 |
| Nov 4, 2026 | 2 |
| Nov 5, 2026 | 5 |
| Nov 6, 2026 | 5 |
| Nov 7, 2026 | 2 |
| Nov 8, 2026 | 2 |
| Nov 9, 2026 | 6 |
| Nov 10, 2026 | 7 |
| Nov 11, 2026 | 8 |
| Nov 12, 2026 | 1 |
| Nov 13, 2026 | 7 |
| Nov 14, 2026 | 1 |
| Nov 15, 2026 | 3 |
| Nov 16, 2026 | 1 |
| Nov 17, 2026 | 7 |
| Nov 18, 2026 | 3 |
| Nov 19, 2026 | 2 |
| Nov 20, 2026 | 0 |
| Nov 21, 2026 | 1 |
| Nov 22, 2026 | 2 |
| Nov 23, 2026 | 7 |
| Nov 24, 2026 | 3 |
| Nov 25, 2026 | 3 |
| Nov 26, 2026 | 2 |
| Nov 27, 2026 | 3 |
| Nov 28, 2026 | 1 |
| Nov 29, 2026 | 0 |
| Nov 30, 2026 | 3 |
| Dec 1, 2026 | 2 |
| Dec 2, 2026 | 6 |
| Dec 3, 2026 | 6 |
| Dec 4, 2026 | 7 |
| Dec 5, 2026 | 1 |
| Dec 6, 2026 | 1 |
| Dec 7, 2026 | 2 |
| Dec 8, 2026 | 2 |
| Dec 9, 2026 | 7 |
| Dec 10, 2026 | 1 |
| Dec 11, 2026 | 2 |
| Dec 12, 2026 | 3 |
| Dec 13, 2026 | 1 |
| Dec 14, 2026 | 3 |
| Dec 15, 2026 | 7 |
| Dec 16, 2026 | 5 |
| Dec 17, 2026 | 3 |
| Dec 18, 2026 | 5 |
| Dec 19, 2026 | 3 |
| Dec 20, 2026 | 1 |
| Dec 21, 2026 | 5 |
| Dec 22, 2026 | 1 |
| Dec 23, 2026 | 6 |
| Dec 24, 2026 | 5 |
| Dec 25, 2026 | 0 |
| Dec 26, 2026 | 2 |
| Dec 27, 2026 | 0 |
| Dec 28, 2026 | 1 |
| Dec 29, 2026 | 7 |
| Dec 30, 2026 | 7 |
| Dec 31, 2026 | 1 |
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| title | string | No | 'Daily activity — 2026' | |
| days | HeatmapDay[] | No | genDefaultYear() | |
| unitLabel | string | No | 'events' | Label for the unit counted, used in cell tooltips ("3 orders"). |
| className | string | No | '' |
File this creates
The CLI writes this path into your project, relative to its root — nothing else moves.
components/velocity/heatmap-calendar/HeatmapCalendar.astro Using the Heatmap Calendar component
Install it with velocityx add heatmap-calendar.
The CLI writes the source straight into your project — no runtime dependency, no registry
lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.
Related components
More from Stats & Numbers.
Stat band whose numbers count up when the section scrolls into view, then settle. No runtime dependency — plain Astro plus a small inline observer. Honours prefers-reduced-motion by rendering final values immediately.
astroPuts two numbers on one shared scale and calls out the delta — the proof-point shape for 'we cut your load time' or 'conversion rate before vs. after' case studies. Ships a screen-reader summary alongside the bars, so the comparison reads correctly even without the visual.
astroOne headline figure sized to carry a section on its own, with a short annotation line underneath for context. Locale-safe number formatting (including compact '4.2M' notation) and a count-up that lands on the real value immediately for reduced-motion users.
astroThe compact way to show actual-vs-target on a scorecard row: a thin fill against a qualitative poor/satisfactory/good band, with a tick marking the target, so a whole KPI reads in the space a single number used to take. Values stay in text too, so it holds up for anyone who can't read the bar visually.
astro