How to Actually Add Stats and Streak Cards to Your GitHub Profile

I've been staring at GitHub profiles for years. I remember when I first set up my own README back in 2020. I wanted it to look cool, so I copy-pasted every single stat badge I could find. Honestly, it looked terrible.

Look, recruiters and other developers definitely care about your activity. Seeing that you actually write code consistently is way better than just saying you're "passionate about software." But slapping five mismatched, brightly-colored widgets onto your page screams amateur.

I'll show you how to pull live analytics into your profile without making it look like a MySpace page from 2006. That means the standard stats card, the streak counter, top languages, and even how to sync your actual editor time using Wakatime. Markdown snippets included — copy them straight over.

1. The Classic GitHub Stats Card

The undisputed king of GitHub widgets is Anurag Hazra's github-readme-stats. If you've ever seen a neat little box showing total commits, pull requests, issues, and stars, this is the one.

When I first used it, I made the mistake of leaving the default white background while the rest of my profile was dark mode. It was blinding. Here's the embed URL you actually want to copy:

![My GitHub Stats](https://github-readme-stats.vercel.app/api?username=your-username&show_icons=true&theme=tokyonight&hide_border=true&count_private=true)

Why I use these exact parameters:

• show_icons=true: This just adds nice little SVGs next to your text. It breaks up the block of text and makes it easier to scan quickly.
• theme=tokyonight: This is my absolute favorite. It gives a really sleek, dark purplish-blue look. If that's not your vibe, try changing it to dark or radical. The radical theme adds a cool pink-to-orange gradient border.
• hide_border=true: This is the secret sauce. Turning off the border makes the widget blend right into your README background instead of looking like a clunky embedded iframe. It feels built-in.
• count_private=true: You definitely want this on. A lot of us work on private client repos or internal company projects. Don't hide all that hard work! Let the world know you're shipping.

2. Tracking Your Coding Streak

If you code every day (or almost every day), the streak widget is a fantastic flex. It tracks your longest uninterrupted run of daily commits and your current active streak.

Here's the snippet I recommend:

![GitHub Streak](https://github-readme-streak-stats.herokuapp.com/?user=your-username&theme=tokyonight&hide_border=true)

Notice a pattern? I kept theme=tokyonight and hide_border=true. If you learn anything from this post, it's that consistency matters. Pick one theme and stick to it across all your widgets. Mixing a bright pink radical stats card with a flat dark streak widget just looks messy.

Don't get too obsessed with your streak, though. I ruined a 150-day streak once because I took a weekend off to go camping and forgot to push a dummy commit. It hurt for a day, but honestly, nobody actually cares if you code 365 days a year. It's just a fun personal challenge.

3. Showing Off Your Top Languages

Instead of manually typing out "I know JavaScript, Python, and Go," you can let your repos do the talking. The top languages card analyzes what you actually push.

![Top Languages](https://github-readme-stats.vercel.app/api/top-langs/?username=your-username&layout=compact&hide_border=true&theme=tokyonight)

I strongly recommend using layout=compact. By default, this card renders as a giant vertical list that eats up half your page. The compact layout shrinks it down into a neat horizontal progress bar. It saves so much screen real estate and looks way more modern.

4. How to Align Them in One Row

Here's the thing: Markdown doesn't really have a grid system. If you just paste those three image URLs one after the other, they might stack vertically or wrap weirdly depending on the screen size.

I struggled with this until I realized I could just use an HTML table. It's old school, but it works flawlessly on GitHub. Here's exactly how you combine the stats, streak, and languages into one neat, centered row:

<div align="center">
  <table>
    <tr>
      <td align="center">
        <img src="https://github-readme-stats.vercel.app/api?username=your-username&show_icons=true&theme=tokyonight&hide_border=true&count_private=true" width="400" />
      </td>
      <td align="center">
        <img src="https://github-readme-streak-stats.herokuapp.com/?user=your-username&theme=tokyonight&hide_border=true" width="400" />
      </td>
    </tr>
    <tr>
      <td align="center" colspan="2">
        <img src="https://github-readme-stats.vercel.app/api/top-langs/?username=your-username&layout=compact&hide_border=true&theme=tokyonight" width="800" />
      </td>
    </tr>
  </table>
</div>

This puts your stats and streak side-by-side on the top row, and spans your languages across the bottom row. Try it out—it looks incredibly clean and organized.

5. Adding Real Editor Stats with Wakatime

GitHub stats are great, but they only show when you push code. What if you spend 10 hours debugging a massive issue locally before making a single commit? Wakatime tracks your actual typing time inside VS Code, IntelliJ, or whatever editor you use.

When recruiters scan your profile, they usually spend less than 30 seconds deciding if you're worth a technical interview. When I interviewed for my last engineering role, the hiring manager explicitly mentioned my Wakatime stats. They liked seeing that my time was split 70% backend and 30% frontend, which perfectly matched the job description.

Setting this up takes a few minutes, but it's totally worth it. Here's my step-by-step walkthrough:

1. Get an Account: Go to Wakatime.com and sign up.
2. Install the Plugin: Open your code editor, go to extensions, and search for "Wakatime". Install it and paste in your secret API key from your Wakatime account dashboard.
3. Set Up the Action: Go to your GitHub profile repository (the one named your-username/your-username). Create a folder called .github, and inside that, create another folder called workflows.
4. Create the Config: Inside workflows, make a file called waka.yml. Paste this code:

name: Waka Readme

on:
  schedule:
    - cron: '0 0 * * *'
  workflow_dispatch:

jobs:
  update-readme:
    name: Update Readme with Metrics
    runs-on: ubuntu-latest
    steps:
      - uses: athul/waka-readme@master
        with:
          WAKATIME_API_KEY: ${{ secrets.WAKATIME_API_KEY }}

5. Add Your Secret: Go to your repository settings on GitHub, find "Secrets and variables" under Security, and add a new repository secret. Name it WAKATIME_API_KEY and paste your actual key.
6. Prep Your README: Finally, edit your README.md and add these two comment tags exactly where you want the stats to show up:

<!--START_SECTION:waka-->
<!--END_SECTION:waka-->

The GitHub Action runs every night at midnight. It automatically grabs your latest coding hours, generates a cool text-based bar chart, and injects it right between those comment tags. You don't have to do a thing.

A quick warning about API rate limits: Because github-readme-stats runs on free public servers, it occasionally gets overwhelmed by traffic. You might load your profile and see a broken image icon instead of your beautiful stats. Don't panic. If this happens a lot, you can easily fork Anurag's repo and deploy your own private instance to Vercel for free. It takes about five minutes, and you'll never hit a rate limit again.

Keep It Simple

Honestly, you don't need fifty badges on your profile. A clean layout with your main stats, your coding streak, and maybe your Wakatime hours is all you need to show you're actively building things. Grab the snippets above, swap in your username, pick a theme you like, and call it a day. Focus on building real projects, and let the widgets do their job in the background.