# heatmap — Examples

## day-grid (GitHub contributions)

```html
<heatmap-ui id="hm-days" type="day-grid" rows="7" cols="52" start-date="2025-01-01" color-scheme="data-ramp"></heatmap-ui>
```

## matrix

```html
<heatmap-ui id="hm-matrix" type="matrix" rows="7" cols="12" color-scheme="accent"></heatmap-ui>
```

## Data stream (data-stream-*)

```html
<heatmap-ui type="matrix" rows="5" cols="4" color-scheme="accent" aria-label="Commit activity from activity.json" data-stream-src="/site/mock/activity.json"></heatmap-ui>
```
