DEV Community

Colin
Colin

Posted on

How to Add a GitHub Streak Stats Card to Your Profile README (Without Another Service)

#opensource #github #webdev #beginners

A commit streak is one of the most popular things people put on their GitHub profile. It's a quick signal that you ship regularly. This guide covers how to add one, and how to keep it from becoming yet another image embed you have to babysit.

Step 1: Set up your profile README

If you don't have one yet:

  1. Create a public repository with the exact same name as your username (e.g. alex/alex).
  2. Add a README.md.

GitHub renders that file at the top of your profile.

Step 2: Add a card with streak stats

The usual approach is a dedicated streak service with its own URL and theme parameters. If you already use separate cards for stats and languages, that's another host and another set of colors to match.

An alternative is to put the streak on the same card as everything else. With GitHubCard, a default card is a single URL, no sign-in needed:

[![GitHub card](https://githubcard.com/YOUR_USERNAME.svg)](https://github.com/YOUR_USERNAME)
Enter fullscreen mode Exit fullscreen mode

Step 3: Make the streak the focus (optional)

If you want the streak front and center:

  1. Open the canvas editor at https://githubcard.com/ and pick a profile card.
  2. Enter your username.
  3. Drag in the Streak Stats widget and resize it as the main element.
  4. Add supporting widgets if you like: Contributions Heatmap, Profile Stats, Language Donut.
  5. Set one theme for the whole card, then export as SVG (or PNG for social posts and slides).

Saving and updating a custom design requires signing in with GitHub.

Things to know

  • Freshness: cards use live GitHub data with caching, so changes can take up to about an hour to appear. Don't panic if today's commit doesn't show immediately.
  • Cost: core features are free, per the site's FAQ.
  • Repos too: the same pattern works for repositories: https://githubcard.com/OWNER/REPO.svg.

A note on streaks

Streaks are motivating, but they're not a measure of quality. Many solid engineers have gaps because they work in private repos or take weekends off. Treat a streak card as a small signal on your profile, not the headline. Pair it with pinned projects and a short line about what you build.

I build GitHubCard. If you try it, I'd genuinely like to hear what's missing.

Top comments (0)