Be honest.
How many times have you opened a GitHub profile and had no idea what that developer actually works with?
Repositories everywhere.
Lots of code.
But no quick overview.
A while ago, my sister and I ran into the same problem while working on our GitHub profiles.
So we decided to build a small open-source tool to solve it.
🚀 GitHub Languages Card
GitHub Languages Card transforms your GitHub profile into a clean visual language card that highlights the technologies you actually use.
No clutter.
No unnecessary statistics.
Just a simple visual representation of your stack.
🎯 Live Demo
🎨 Themes
One of the most fun parts of building this project was designing different themes.
Whether you prefer something minimal, colorful, or hacker-inspired, there's a theme for you.
My personal favorites:
🔥 dark-neon
💻 hacker
💖 pink
Because developer tools should have personality too.
💡 Why We Built It
Most GitHub profiles contain a lot of information, but very little of it is immediately visible.
We wanted a way to answer a simple question:
«What does this developer actually code in?»
Instead of forcing visitors to browse through repositories, GitHub Languages Card provides an instant overview.
⚙️ What It Does
The tool:
- Fetches your public repositories
- Analyzes the languages you use
- Calculates language distribution
- Generates a beautiful card ready to embed in your README
- Supports multiple themes and customization options
All you need is your GitHub username.
🚀 Why You Might Like It
If your README feels:
- Empty
- Outdated
- Generic
- Hard to personalize
This tool can improve it in seconds.
Simply generate your card and add it to your profile.
🔥 Real Use Case
Imagine a recruiter, contributor, or fellow developer visiting your GitHub profile.
Instead of digging through repositories to understand your stack, they instantly see the technologies you use most.
It's a small detail, but it makes your profile more informative and visually appealing.
🧠 What We Learned Building It
This project was a great opportunity to learn more about:
- Working with the GitHub API
- Processing real-world repository data
- Building developer-focused tools
- Designing reusable open-source projects
It also reminded us that simple ideas can create meaningful improvements.
📦 Repository
Interested in the implementation?
👉 View the source code on GitHub
If you find it useful:
- ⭐ Star it
- 🍴 Fork it
- 🚀 Add it to your README
❤️ Final Thoughts
Not every project needs to be a massive application.
Sometimes the best projects are small tools that solve a real problem.
And if your README still looks a little too plain...
Maybe it's time to give it an upgrade.
Top comments (5)
This is great!!! I enjoyed using the demo and seeing what I got! lol I am actually surpised to see I use more Typescript than Javascript and Python combined! lol! This was a really cool and intelligent idea!
Solid! I can see how much effort you put into this.
Thanks a lot! That means a lot to me.🙏🏻
I'm always trying to improve, and who knows maybe we'll work together on a project in the future!
Keep going — you’re on a great path. And yes, I’d be happy to explore a project together when the time is right!
😍💪🏻 we will wait and glad to work with you