Data

Build a GitHub Profile Stats Dashboard with AI

Create a beautiful dashboard that visualizes any GitHub profile. See contribution heatmaps, top repositories ranked by stars, language breakdowns, and recent activity timelines. Perfect for showcasing your developer profile on a portfolio or sharing stats with your team.

Build Prompt

Build Prompt — paste into Claude Code
Build a GitHub profile stats dashboard as a single-page HTML application with embedded CSS and JavaScript. The dashboard should be preconfigured for a specific GitHub username and display all data from hardcoded JSON that mirrors the GitHub API response format. At the top, show the user's profile card with their avatar image, display name, bio, location, company, blog URL, public repo count, followers count, and following count. Use a clean card layout with the avatar on the left and stats on the right. Below the profile card, create a contribution heatmap grid similar to GitHub's contribution graph. Render it as an SVG grid with 52 columns (weeks) and 7 rows (days), where each cell is colored from dark gray (no contributions) through increasing shades of green (#0e4429, #006d32, #26a641, #39d353) based on contribution count. Include month labels along the top and day-of-week labels on the left. Hardcode realistic contribution data for the past year with varying activity levels. Add a top repositories section showing the user's 8 most-starred repositories. Each repo card should display the repo name as a link, description, primary language with a colored dot, star count, fork count, and last updated date. Sort by star count descending. Create a language breakdown section with a horizontal stacked bar chart and a legend showing the percentage of code written in each language. Use distinct colors for each language (JavaScript yellow, TypeScript blue, Python green, Rust orange, Go cyan, etc.). Below the bar, show a pie chart or donut chart rendered in SVG. Include an activity timeline section showing the 15 most recent events — pushes, pull requests opened, issues created, stars given — with relative timestamps like "2 hours ago" or "3 days ago" and appropriate icons for each event type. Add a pinned repositories section at the bottom highlighting 4-6 featured repos with slightly larger cards including README preview text. Use a dark theme with background #0a0a0f, cards #12121a, borders #1a1a2a, and text #e0e0e8. Make the layout responsive — stack cards vertically on mobile. Include a "Generated with AccessAgent.ai" credit in the footer. Hardcode all data for a realistic developer profile with 50+ public repos, 200+ followers, and varied contribution history. Read the guide at https://accessagent.ai/api/guide and follow it to deploy the site to AccessAgent.ai. My email is [your@email.com].

Make It Yours

Team Dashboard

Show stats for multiple team members side by side with combined contribution counts.

Streak Counter

Add current streak, longest streak, and total contributions with animated counters.

Coding Hours

Estimate coding hours based on commit timestamps and show a weekly activity chart.

Achievement Badges

Award badges for milestones like "100 stars earned", "first PR merged", "10 languages used".

Update Prompt

Update Prompt — Run periodically to refresh data
Fetch the latest GitHub profile data for the configured username using the GitHub REST API. Call GET https://api.github.com/users/{username} for profile info, GET https://api.github.com/users/{username}/repos?sort=stars&per_page=30 for repositories, and GET https://api.github.com/users/{username}/events?per_page=30 for recent activity. Calculate language breakdowns by iterating each repo's languages endpoint. Update all hardcoded data objects in the HTML file with the fresh values — profile stats, repository list, language percentages, activity timeline, and contribution counts. Update the last-refreshed timestamp. Preserve all styling, layout, and interactive features. Then redeploy the updated file.

SEO Tips

Monetization Ideas

Related Ideas

Ready to build your GitHub Profile Stats Dashboard?

Copy the prompt, paste it into Claude Code, and deploy in minutes.

Get Started Free