DEV Community

Ryoichi Homma
Ryoichi Homma

Posted on

How to Customize GitHub Profile: Part 5

Welcome back to the final part of my series on customizing your GitHub profile! In this article, we'll focus on adding GitHub stats to your profile. Displaying your stats can provide visitors insights into your coding activity, the languages you use, and other key metrics, highlighting your GitHub presence.
Part 1 | Part 2 | Part 3 | Part 4
Example Image

Add GitHub Stats and Why

GitHub stats offer a quick overview of your contributions, showcasing your commitment and areas of expertise. Adding these visual elements can make your profile more informative and engaging.

  1. Transparency: Stats offer a transparent view of your activity and contributions.
  2. Highlight Skills: They highlight the most used programming languages.
  3. Motivation: Tracking your stats can be motivating as you see your progress over time.

Setting Up GitHub Stats

To add GitHub stats to your profile, you can use the following services. Here's a step-by-step guide:

  • GitHub Stats Card: ← Visit the repository and generate the URL for your stats card.

Syntax:

<a href="https://github.com/anuraghazra/github-readme-stats">
   <img alt="GitHub Stats Card" src="https://github-readme-stats.vercel.app/api?username=YOUR_USERNAME">
</a>
Enter fullscreen mode Exit fullscreen mode

i.e.)Stats Card Exmaple

Syntax:

<a src="https://github.com/anuraghazra/github-readme-stats">
   <img alt="Top Languages Card" src="https://github-readme-stats.vercel.app/api/top-langs/?username=YOUR_USERNAME">
</a>
Enter fullscreen mode Exit fullscreen mode

i.e.)
Languages Card Examples

  • Streak Stats: ← Visit the repository and generate the URL for your stats card.

Syntax:

<a href="https://git.io/streak-stats">
   <img src="https://streak-stats.demolab.com?user=YOUR_USERNAME" alt="GitHub Streak">
</a>
Enter fullscreen mode Exit fullscreen mode

i.e.)
Streak Stat Examples

Customize GitHub Stats

You can customize the appearance of your stats cards by changing the theme, hiding certain stats, and adjusting other settings. Check each link for all available customization options.

Wrapping Up

In this part, we covered how to add GitHub stats to your profile. By displaying your activity, streak, and most used languages, you can provide visitors with valuable insights into your coding journey. Stay tuned for the next part, where we'll discuss additional tips and tricks for further enhancing your GitHub profile.

Thank you for following along with this series on customizing GitHub profiles! Your interest and dedication to improving your profile can significantly impact how others perceive your work and skills. I hope these guides have provided you with useful tips and tools to enhance your GitHub presence.

If you have any questions, feel free to ask in the comments below. I'd love to see how you've customized your profiles, so don't hesitate to share your links!

Happy coding!💻

References

Anurag Hazra's Repository
Jonah Lawrence's Repository
GitHub Readme Streak Stats

Other Parts

Part 1 | Part 2 | Part 3 | Part 4

Top comments (1)

Collapse
 
raajaryan profile image
Deepak Kumar

Hello everyone,

I hope you're all doing well. I recently launched an open-source project called the Ultimate JavaScript Project, and I'd love your support. Please check it out and give it a star on GitHub: Ultimate JavaScript Project. Your support would mean a lot to me and greatly help in the project's growth.

Thank you!

Some comments may only be visible to logged-in visitors. Sign in to view all comments.