Created
January 21, 2026 13:41
-
-
Save brtkwr/d4daa50af44ce2d267729d6332bf7d25 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>AI Adoption Report - Jul 2025 to Jan 2026</title> | |
| <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> | |
| <style> | |
| * { | |
| box-sizing: border-box; | |
| } | |
| body { | |
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; | |
| max-width: 1600px; | |
| margin: 0 auto; | |
| padding: 20px; | |
| background-color: #f5f5f5; | |
| } | |
| h1 { | |
| color: #333; | |
| text-align: center; | |
| margin-bottom: 5px; | |
| } | |
| .subtitle { | |
| text-align: center; | |
| color: #666; | |
| margin-bottom: 30px; | |
| font-size: 16px; | |
| } | |
| .summary { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); | |
| gap: 12px; | |
| margin-bottom: 30px; | |
| } | |
| .summary-card { | |
| background: white; | |
| padding: 16px; | |
| border-radius: 8px; | |
| box-shadow: 0 2px 4px rgba(0,0,0,0.1); | |
| } | |
| .summary-card.claude-ai { border-left: 4px solid #8b5cf6; } | |
| .summary-card.api { border-left: 4px solid #f59e0b; } | |
| .summary-card.combined { border-left: 4px solid #10b981; } | |
| .summary-card.neutral { border-left: 4px solid #6b7280; } | |
| .summary-card.growth { border-left: 4px solid #3b82f6; } | |
| .summary-card h3 { | |
| margin: 0 0 8px 0; | |
| font-size: 11px; | |
| color: #666; | |
| text-transform: uppercase; | |
| letter-spacing: 0.5px; | |
| } | |
| .summary-card p { | |
| margin: 0; | |
| font-size: 24px; | |
| font-weight: bold; | |
| color: #333; | |
| } | |
| .summary-card .growth-value { | |
| color: #10b981; | |
| } | |
| .summary-card .growth-value.negative { | |
| color: #ef4444; | |
| } | |
| .charts-section { | |
| display: grid; | |
| grid-template-columns: repeat(2, 1fr); | |
| gap: 20px; | |
| margin-bottom: 30px; | |
| } | |
| .chart-container { | |
| background: white; | |
| padding: 20px; | |
| border-radius: 8px; | |
| box-shadow: 0 2px 4px rgba(0,0,0,0.1); | |
| } | |
| .chart-container h3 { | |
| margin: 0 0 15px 0; | |
| font-size: 14px; | |
| color: #333; | |
| } | |
| .chart-wrapper { | |
| position: relative; | |
| height: 250px; | |
| } | |
| .section-title { | |
| font-size: 18px; | |
| font-weight: 600; | |
| color: #333; | |
| margin: 30px 0 15px 0; | |
| } | |
| .monthly-table, .users-table { | |
| background: white; | |
| padding: 20px; | |
| border-radius: 8px; | |
| box-shadow: 0 2px 4px rgba(0,0,0,0.1); | |
| margin-bottom: 30px; | |
| overflow-x: auto; | |
| } | |
| table { | |
| width: 100%; | |
| border-collapse: collapse; | |
| } | |
| th, td { | |
| text-align: left; | |
| padding: 10px 8px; | |
| border-bottom: 1px solid #eee; | |
| font-size: 13px; | |
| } | |
| th { | |
| background-color: #f8f9fa; | |
| font-weight: 600; | |
| color: #555; | |
| font-size: 11px; | |
| text-transform: uppercase; | |
| letter-spacing: 0.5px; | |
| } | |
| tr:hover { | |
| background-color: #f8f9fa; | |
| } | |
| .number { | |
| text-align: right; | |
| font-variant-numeric: tabular-nums; | |
| } | |
| .cost.claude-ai { color: #8b5cf6; font-weight: 600; } | |
| .cost.api { color: #f59e0b; font-weight: 600; } | |
| .cost.combined { color: #10b981; font-weight: 600; } | |
| .muted { color: #9ca3af; } | |
| .legend { | |
| display: flex; | |
| justify-content: center; | |
| gap: 24px; | |
| margin-bottom: 25px; | |
| font-size: 13px; | |
| } | |
| .legend-item { | |
| display: flex; | |
| align-items: center; | |
| gap: 6px; | |
| } | |
| .legend-dot { | |
| width: 12px; | |
| height: 12px; | |
| border-radius: 50%; | |
| } | |
| .legend-dot.claude-ai { background-color: #8b5cf6; } | |
| .legend-dot.api { background-color: #f59e0b; } | |
| @media (max-width: 900px) { | |
| .charts-section { | |
| grid-template-columns: 1fr; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>AI Adoption Report</h1> | |
| <div class="subtitle">Jul 2025 to Jan 2026 (7 months)</div> | |
| <div class="legend"> | |
| <div class="legend-item"> | |
| <div class="legend-dot claude-ai"></div> | |
| <span>Claude.ai (IDE / Claude Code)</span> | |
| </div> | |
| <div class="legend-item"> | |
| <div class="legend-dot api"></div> | |
| <span>Anthropic API (Direct)</span> | |
| </div> | |
| </div> | |
| <div class="summary"> | |
| <div class="summary-card combined"> | |
| <h3>Total Spend</h3> | |
| <p>$18,806</p> | |
| </div> | |
| <div class="summary-card claude-ai"> | |
| <h3>Claude.ai</h3> | |
| <p>$10,324</p> | |
| </div> | |
| <div class="summary-card api"> | |
| <h3>API</h3> | |
| <p>$8,482</p> | |
| </div> | |
| <div class="summary-card neutral"> | |
| <h3>Users</h3> | |
| <p>19</p> | |
| </div> | |
| <div class="summary-card neutral"> | |
| <h3>Lines Accepted</h3> | |
| <p>737k</p> | |
| </div> | |
| <div class="summary-card neutral"> | |
| <h3>Commits</h3> | |
| <p>3,537</p> | |
| </div> | |
| <div class="summary-card neutral"> | |
| <h3>PRs</h3> | |
| <p>648</p> | |
| </div> | |
| <div class="summary-card growth"> | |
| <h3>Cost Growth</h3> | |
| <p class="growth-value ">+286%</p> | |
| </div> | |
| </div> | |
| <div class="charts-section"> | |
| <div class="chart-container"> | |
| <h3>Monthly Cost Trend</h3> | |
| <div class="chart-wrapper"> | |
| <canvas id="costChart"></canvas> | |
| </div> | |
| </div> | |
| <div class="chart-container"> | |
| <h3>Lines of Code Accepted</h3> | |
| <div class="chart-wrapper"> | |
| <canvas id="linesChart"></canvas> | |
| </div> | |
| </div> | |
| <div class="chart-container"> | |
| <h3>Active Users</h3> | |
| <div class="chart-wrapper"> | |
| <canvas id="usersChart"></canvas> | |
| </div> | |
| </div> | |
| <div class="chart-container"> | |
| <h3>Commits & PRs</h3> | |
| <div class="chart-wrapper"> | |
| <canvas id="activityChart"></canvas> | |
| </div> | |
| </div> | |
| </div> | |
| <h2 class="section-title">Monthly Breakdown</h2> | |
| <div class="monthly-table"> | |
| <table> | |
| <thead> | |
| <tr> | |
| <th>Month</th> | |
| <th class="number">Claude.ai</th> | |
| <th class="number">API</th> | |
| <th class="number">Combined</th> | |
| <th class="number">Lines</th> | |
| <th class="number">Sessions</th> | |
| <th class="number">Commits</th> | |
| <th class="number">PRs</th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <tr> | |
| <td>Jul 2025</td> | |
| <td class="number cost claude-ai">$0</td> | |
| <td class="number cost api">$780</td> | |
| <td class="number cost combined">$780</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| </tr> | |
| <tr> | |
| <td>Aug 2025</td> | |
| <td class="number cost claude-ai">$0</td> | |
| <td class="number cost api">$875</td> | |
| <td class="number cost combined">$875</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| </tr> | |
| <tr> | |
| <td>Sep 2025</td> | |
| <td class="number cost claude-ai">$0</td> | |
| <td class="number cost api">$2,494</td> | |
| <td class="number cost combined">$2,494</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| <td class="number">0</td> | |
| </tr> | |
| <tr> | |
| <td>Oct 2025</td> | |
| <td class="number cost claude-ai">$1,264</td> | |
| <td class="number cost api">$1,770</td> | |
| <td class="number cost combined">$3,034</td> | |
| <td class="number">70,526</td> | |
| <td class="number">440</td> | |
| <td class="number">278</td> | |
| <td class="number">52</td> | |
| </tr> | |
| <tr> | |
| <td>Nov 2025</td> | |
| <td class="number cost claude-ai">$2,294</td> | |
| <td class="number cost api">$1,509</td> | |
| <td class="number cost combined">$3,803</td> | |
| <td class="number">201,205</td> | |
| <td class="number">512</td> | |
| <td class="number">1193</td> | |
| <td class="number">260</td> | |
| </tr> | |
| <tr> | |
| <td>Dec 2025</td> | |
| <td class="number cost claude-ai">$4,226</td> | |
| <td class="number cost api">$579</td> | |
| <td class="number cost combined">$4,805</td> | |
| <td class="number">306,292</td> | |
| <td class="number">468</td> | |
| <td class="number">1280</td> | |
| <td class="number">176</td> | |
| </tr> | |
| <tr> | |
| <td>Jan 2026</td> | |
| <td class="number cost claude-ai">$2,541</td> | |
| <td class="number cost api">$474</td> | |
| <td class="number cost combined">$3,015</td> | |
| <td class="number">159,003</td> | |
| <td class="number">341</td> | |
| <td class="number">786</td> | |
| <td class="number">160</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <h2 class="section-title">User Breakdown (All Time)</h2> | |
| <div class="users-table"> | |
| <table> | |
| <thead> | |
| <tr> | |
| <th>User</th> | |
| <th class="number">Claude.ai</th> | |
| <th class="number">API</th> | |
| <th class="number">Combined</th> | |
| <th class="number">Lines</th> | |
| <th class="number">Sessions</th> | |
| <th class="number">Months Active</th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <tr> | |
| <td>bkunwar@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $4,739 | |
| </td> | |
| <td class="number cost api"> | |
| $1,171 | |
| </td> | |
| <td class="number cost combined">$5,910</td> | |
| <td class="number"> | |
| 273,317 | |
| </td> | |
| <td class="number"> | |
| 1013 | |
| </td> | |
| <td class="number">7</td> | |
| </tr> | |
| <tr> | |
| <td>pannamudu@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $2,329 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$2,329</td> | |
| <td class="number"> | |
| 284,990 | |
| </td> | |
| <td class="number"> | |
| 169 | |
| </td> | |
| <td class="number">3</td> | |
| </tr> | |
| <tr> | |
| <td>ebronstad@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $1,471 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$1,471</td> | |
| <td class="number"> | |
| 73,468 | |
| </td> | |
| <td class="number"> | |
| 330 | |
| </td> | |
| <td class="number">4</td> | |
| </tr> | |
| <tr> | |
| <td>dlindsay@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $1,183 | |
| </td> | |
| <td class="number cost api"> | |
| $179 | |
| </td> | |
| <td class="number cost combined">$1,362</td> | |
| <td class="number"> | |
| 48,240 | |
| </td> | |
| <td class="number"> | |
| 93 | |
| </td> | |
| <td class="number">7</td> | |
| </tr> | |
| <tr> | |
| <td>vangelis@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $523 | |
| </td> | |
| <td class="number cost combined">$523</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">6</td> | |
| </tr> | |
| <tr> | |
| <td>dsieradzki@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $301 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$301</td> | |
| <td class="number"> | |
| 10,788 | |
| </td> | |
| <td class="number"> | |
| 1 | |
| </td> | |
| <td class="number">4</td> | |
| </tr> | |
| <tr> | |
| <td>satta@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $220 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$220</td> | |
| <td class="number"> | |
| 38,711 | |
| </td> | |
| <td class="number"> | |
| 142 | |
| </td> | |
| <td class="number">3</td> | |
| </tr> | |
| <tr> | |
| <td>hnguyen@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $168 | |
| </td> | |
| <td class="number cost combined">$168</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">5</td> | |
| </tr> | |
| <tr> | |
| <td>bkenney@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $123 | |
| </td> | |
| <td class="number cost combined">$123</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">6</td> | |
| </tr> | |
| <tr> | |
| <td>gpreuss@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $114 | |
| </td> | |
| <td class="number cost combined">$114</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">6</td> | |
| </tr> | |
| <tr> | |
| <td>mjohnson@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $88 | |
| </td> | |
| <td class="number cost combined">$88</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">6</td> | |
| </tr> | |
| <tr> | |
| <td>gkerr@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $53 | |
| </td> | |
| <td class="number cost combined">$53</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">6</td> | |
| </tr> | |
| <tr> | |
| <td>kmiller@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $39 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$39</td> | |
| <td class="number"> | |
| 2,093 | |
| </td> | |
| <td class="number"> | |
| 3 | |
| </td> | |
| <td class="number">1</td> | |
| </tr> | |
| <tr> | |
| <td>nbatishcheva@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $37 | |
| </td> | |
| <td class="number cost combined">$37</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">5</td> | |
| </tr> | |
| <tr> | |
| <td>akarle@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $16 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$16</td> | |
| <td class="number"> | |
| 4,293 | |
| </td> | |
| <td class="number"> | |
| 6 | |
| </td> | |
| <td class="number">1</td> | |
| </tr> | |
| <tr> | |
| <td>vbjorsvik@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $13 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$13</td> | |
| <td class="number"> | |
| 512 | |
| </td> | |
| <td class="number"> | |
| 2 | |
| </td> | |
| <td class="number">1</td> | |
| </tr> | |
| <tr> | |
| <td>brtkwr@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| $13 | |
| </td> | |
| <td class="number cost api"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost combined">$13</td> | |
| <td class="number"> | |
| 614 | |
| </td> | |
| <td class="number"> | |
| 2 | |
| </td> | |
| <td class="number">1</td> | |
| </tr> | |
| <tr> | |
| <td>jedwards@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $9 | |
| </td> | |
| <td class="number cost combined">$9</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">5</td> | |
| </tr> | |
| <tr> | |
| <td>lcunha@two.inc</td> | |
| <td class="number cost claude-ai"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number cost api"> | |
| $1 | |
| </td> | |
| <td class="number cost combined">$1</td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number"> | |
| <span class="muted">-</span> | |
| </td> | |
| <td class="number">1</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <script> | |
| const months = ["Jul 2025", "Aug 2025", "Sep 2025", "Oct 2025", "Nov 2025", "Dec 2025", "Jan 2026"]; | |
| const claudeAiCosts = [0, 0, 0, 1263.69893085, 2293.8823174, 4225.7218222, 2540.9566497]; | |
| const apiCosts = [780.35497485, 875.36115844, 2493.7919265, 1770.4309281, 1508.9155772, 578.9985163, 474.1434312]; | |
| const lines = [0, 0, 0, 70526, 201205, 306292, 159003]; | |
| const claudeAiUsers = [0, 0, 0, 3, 6, 6, 10]; | |
| const apiUsers = [2, 7, 10, 10, 9, 8, 10]; | |
| const commits = [0, 0, 0, 278, 1193, 1280, 786]; | |
| const prs = [0, 0, 0, 52, 260, 176, 160]; | |
| const chartOptions = { | |
| responsive: true, | |
| maintainAspectRatio: false, | |
| plugins: { | |
| legend: { | |
| position: 'bottom', | |
| labels: { boxWidth: 12, padding: 15 } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: true, | |
| grid: { color: '#f0f0f0' } | |
| }, | |
| x: { | |
| grid: { display: false } | |
| } | |
| } | |
| }; | |
| // Cost Chart (stacked bar) | |
| new Chart(document.getElementById('costChart'), { | |
| type: 'bar', | |
| data: { | |
| labels: months, | |
| datasets: [ | |
| { | |
| label: 'Claude.ai', | |
| data: claudeAiCosts, | |
| backgroundColor: '#8b5cf6', | |
| }, | |
| { | |
| label: 'API', | |
| data: apiCosts, | |
| backgroundColor: '#f59e0b', | |
| } | |
| ] | |
| }, | |
| options: { | |
| ...chartOptions, | |
| scales: { | |
| ...chartOptions.scales, | |
| x: { stacked: true, grid: { display: false } }, | |
| y: { stacked: true, beginAtZero: true, grid: { color: '#f0f0f0' } } | |
| } | |
| } | |
| }); | |
| // Lines Chart | |
| new Chart(document.getElementById('linesChart'), { | |
| type: 'line', | |
| data: { | |
| labels: months, | |
| datasets: [{ | |
| label: 'Lines Accepted', | |
| data: lines, | |
| borderColor: '#10b981', | |
| backgroundColor: 'rgba(16, 185, 129, 0.1)', | |
| fill: true, | |
| tension: 0.3 | |
| }] | |
| }, | |
| options: chartOptions | |
| }); | |
| // Users Chart | |
| new Chart(document.getElementById('usersChart'), { | |
| type: 'line', | |
| data: { | |
| labels: months, | |
| datasets: [ | |
| { | |
| label: 'Claude.ai Users', | |
| data: claudeAiUsers, | |
| borderColor: '#8b5cf6', | |
| backgroundColor: 'rgba(139, 92, 246, 0.1)', | |
| fill: false, | |
| tension: 0.3 | |
| }, | |
| { | |
| label: 'API Users', | |
| data: apiUsers, | |
| borderColor: '#f59e0b', | |
| backgroundColor: 'rgba(245, 158, 11, 0.1)', | |
| fill: false, | |
| tension: 0.3 | |
| } | |
| ] | |
| }, | |
| options: chartOptions | |
| }); | |
| // Activity Chart | |
| new Chart(document.getElementById('activityChart'), { | |
| type: 'bar', | |
| data: { | |
| labels: months, | |
| datasets: [ | |
| { | |
| label: 'Commits', | |
| data: commits, | |
| backgroundColor: '#3b82f6', | |
| }, | |
| { | |
| label: 'PRs', | |
| data: prs, | |
| backgroundColor: '#ec4899', | |
| } | |
| ] | |
| }, | |
| options: chartOptions | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment