Search blocks by description or jump to a page.
An activity heatmap showing 1654 contributions across 52 weeks using theme-token opacity squares with a streak note and quarterly commit breakdown.
The source for every Portfolio block is included with Pro and Team. Start a plan to copy the code.
Already on a plan? Log in
Contributions Grid shows 1,654 contributions in the past year as a 52 by 7 CSS-grid heatmap where each cell uses theme-token opacity to express activity weight, no green scale. A 23-day streak note sits beside the heading, and a four-column quarterly breakdown below names the rhythm: Q3 2025 saw an open source sprint at 511 commits; Q2 2025 was dominated by client work at 294.
The cells are deterministic from index so the grid reads as realistic without live data. The opacity scale is the distinctive choice, a single foreground colour at five opacity levels stays on-theme across light and dark modes without hardcoding any hue.
Reach for this block as the activity section on a developer portfolio homepage or a dedicated open source page. The installer replaces the quarterly commit counts and notes with their real figures and wires the heatmap to a live data source.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is the annual contribution heatmap with quarterly context. Other developer activity layouts:
Tip: the quarterly note is the real signal, a year with 511 commits in Q3 and 294 in Q2 tells the story of a person with a day job and a side project, which is more credible than a flat average.