Skip to content

Instantly share code, notes, and snippets.

@joshbeckman
Created February 10, 2026 14:42
Show Gist options
  • Select an option

  • Save joshbeckman/adda6f3e573e005b433e598471de192d to your computer and use it in GitHub Desktop.

Select an option

Save joshbeckman/adda6f3e573e005b433e598471de192d to your computer and use it in GitHub Desktop.
GitHub Status Incident Timeline — Feb 2025 to Feb 2026
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GitHub Status Incident Timeline — Feb 2025 to Feb 2026</title>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
background: #0d1117;
color: #c9d1d9;
margin: 0;
padding: 40px;
display: flex;
flex-direction: column;
align-items: center;
}
h1 {
font-size: 1.5rem;
font-weight: 600;
margin-bottom: 4px;
color: #f0f6fc;
}
.subtitle {
color: #8b949e;
font-size: 0.875rem;
margin-bottom: 32px;
}
.chart-container {
width: 900px;
max-width: 100%;
}
svg {
width: 100%;
height: auto;
}
.bar {
transition: opacity 0.15s;
cursor: default;
}
.bar:hover {
opacity: 0.85;
}
.axis-label {
fill: #8b949e;
font-size: 12px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.grid-line {
stroke: #21262d;
stroke-width: 1;
}
.bar-label {
fill: #f0f6fc;
font-size: 12px;
font-weight: 600;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.avg-line {
stroke: #f0883e;
stroke-width: 2;
stroke-dasharray: 6 4;
}
.avg-label {
fill: #f0883e;
font-size: 11px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.note {
fill: #8b949e;
font-size: 10px;
font-style: italic;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.legend {
color: #8b949e;
font-size: 0.75rem;
margin-top: 16px;
text-align: center;
}
a {
color: #58a6ff;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<h1>GitHub Incident Timeline</h1>
<div class="subtitle">Monthly incidents reported on <a href="https://www.githubstatus.com/history">githubstatus.com</a> — Feb 2025 to Feb 2026</div>
<div class="chart-container">
<svg viewBox="0 0 900 420" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="barGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#58a6ff" stop-opacity="1"/>
<stop offset="100%" stop-color="#1f6feb" stop-opacity="0.8"/>
</linearGradient>
<linearGradient id="barGradPartial" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#58a6ff" stop-opacity="0.5"/>
<stop offset="100%" stop-color="#1f6feb" stop-opacity="0.35"/>
</linearGradient>
</defs>
<!-- Grid lines -->
<line class="grid-line" x1="60" y1="60" x2="870" y2="60"/>
<line class="grid-line" x1="60" y1="120" x2="870" y2="120"/>
<line class="grid-line" x1="60" y1="180" x2="870" y2="180"/>
<line class="grid-line" x1="60" y1="240" x2="870" y2="240"/>
<line class="grid-line" x1="60" y1="300" x2="870" y2="300"/>
<line class="grid-line" x1="60" y1="360" x2="870" y2="360"/>
<!-- Y-axis labels -->
<text class="axis-label" x="50" y="64" text-anchor="end">30</text>
<text class="axis-label" x="50" y="124" text-anchor="end">25</text>
<text class="axis-label" x="50" y="184" text-anchor="end">20</text>
<text class="axis-label" x="50" y="244" text-anchor="end">15</text>
<text class="axis-label" x="50" y="304" text-anchor="end">10</text>
<text class="axis-label" x="50" y="364" text-anchor="end">5</text>
<!-- Bars: x starts at 75, width=50, gap=12.3 (13 months) -->
<!-- Scale: 0 incidents = y:360, 30 incidents = y:60, so each incident = 10px -->
<!-- Feb 2025: 16 → height=160, y=200 -->
<rect class="bar" x="75" y="200" width="50" height="160" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="100" y="193" text-anchor="middle">16</text>
<!-- Mar 2025: 19 → height=190, y=170 -->
<rect class="bar" x="137" y="170" width="50" height="190" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="162" y="163" text-anchor="middle">19</text>
<!-- Apr 2025: 19 → height=190, y=170 -->
<rect class="bar" x="199" y="170" width="50" height="190" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="224" y="163" text-anchor="middle">19</text>
<!-- May 2025: 23 → height=230, y=130 -->
<rect class="bar" x="261" y="130" width="50" height="230" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="286" y="123" text-anchor="middle">23</text>
<!-- Jun 2025: 19 → height=190, y=170 -->
<rect class="bar" x="323" y="170" width="50" height="190" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="348" y="163" text-anchor="middle">19</text>
<!-- Jul 2025: 16 → height=160, y=200 -->
<rect class="bar" x="385" y="200" width="50" height="160" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="410" y="193" text-anchor="middle">16</text>
<!-- Aug 2025: 12 → height=120, y=240 -->
<rect class="bar" x="447" y="240" width="50" height="120" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="472" y="233" text-anchor="middle">12</text>
<!-- Sep 2025: 16 → height=160, y=200 -->
<rect class="bar" x="509" y="200" width="50" height="160" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="534" y="193" text-anchor="middle">16</text>
<!-- Oct 2025: 22 → height=220, y=140 -->
<rect class="bar" x="571" y="140" width="50" height="220" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="596" y="133" text-anchor="middle">22</text>
<!-- Nov 2025: 17 → height=170, y=190 -->
<rect class="bar" x="633" y="190" width="50" height="170" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="658" y="183" text-anchor="middle">17</text>
<!-- Dec 2025: 15 → height=150, y=210 -->
<rect class="bar" x="695" y="210" width="50" height="150" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="720" y="203" text-anchor="middle">15</text>
<!-- Jan 2026: 25 → height=250, y=110 -->
<rect class="bar" x="757" y="110" width="50" height="250" rx="4" fill="url(#barGrad)"/>
<text class="bar-label" x="782" y="103" text-anchor="middle">25</text>
<!-- Feb 2026: 14 (partial) → height=140, y=220 -->
<rect class="bar" x="819" y="220" width="50" height="140" rx="4" fill="url(#barGradPartial)"/>
<text class="bar-label" x="844" y="213" text-anchor="middle" opacity="0.6">14*</text>
<!-- X-axis labels -->
<text class="axis-label" x="100" y="385" text-anchor="middle">Feb</text>
<text class="axis-label" x="162" y="385" text-anchor="middle">Mar</text>
<text class="axis-label" x="224" y="385" text-anchor="middle">Apr</text>
<text class="axis-label" x="286" y="385" text-anchor="middle">May</text>
<text class="axis-label" x="348" y="385" text-anchor="middle">Jun</text>
<text class="axis-label" x="410" y="385" text-anchor="middle">Jul</text>
<text class="axis-label" x="472" y="385" text-anchor="middle">Aug</text>
<text class="axis-label" x="534" y="385" text-anchor="middle">Sep</text>
<text class="axis-label" x="596" y="385" text-anchor="middle">Oct</text>
<text class="axis-label" x="658" y="385" text-anchor="middle">Nov</text>
<text class="axis-label" x="720" y="385" text-anchor="middle">Dec</text>
<text class="axis-label" x="782" y="385" text-anchor="middle">Jan</text>
<text class="axis-label" x="844" y="385" text-anchor="middle">Feb</text>
<!-- Year labels -->
<text class="axis-label" x="100" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="162" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="224" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="286" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="348" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="410" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="472" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="534" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="596" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="658" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="720" y="400" text-anchor="middle">'25</text>
<text class="axis-label" x="782" y="400" text-anchor="middle">'26</text>
<text class="axis-label" x="844" y="400" text-anchor="middle">'26</text>
<!-- Average line: avg of full months = (16+19+19+23+19+16+12+16+22+17+15+25)/12 = 219/12 ≈ 18.25 → y = 360 - 18.25*10 = 177.5 -->
<line class="avg-line" x1="60" y1="177.5" x2="820" y2="177.5"/>
<text class="avg-label" x="56" y="175" text-anchor="end">avg</text>
<text class="avg-label" x="56" y="186" text-anchor="end">18.3</text>
<!-- Partial month note -->
<text class="note" x="844" y="415" text-anchor="middle">*partial month</text>
</svg>
</div>
<div class="legend">
Total incidents (full months): 219 &nbsp;|&nbsp; Monthly average: 18.3 &nbsp;|&nbsp; Peak: Jan 2026 (25) &nbsp;|&nbsp; Low: Aug 2025 (12)<br>
Data source: <a href="https://www.githubstatus.com/history">githubstatus.com/history</a> &nbsp;|&nbsp; Collected 2026-02-09
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment