DEV Community

Cover image for I turned your GitHub contribution graph into a 3D city you can drive through
Rishabh Bhartiya
Rishabh Bhartiya

Posted on

I turned your GitHub contribution graph into a 3D city you can drive through

Every developer has that green squares grid on their GitHub profile. You stare at it, feel guilty about the gaps, and move on.

I wanted to make it feel alive. So I built GitCity.

What is it?

GitCity transforms your GitHub contribution history into an interactive isometric 3D city. Every day you commit, a building grows. The more commits, the taller the tower. Years of consistent coding turns into a proper skyline.

👉 Try it: gitcity.natrajx.in

The feature nobody expected

You can switch to simulation mode and drive a car through the city you built with your code.

It started as a joke. It's now the thing everyone screenshots.

Driving simulation

Features

  • 🏙️ Isometric 3D city from your GitHub contributions
  • 🚗 Driveable city simulation mode
  • 🎨 6 themes — Matrix, Noir, Aurora, Ocean, Gold, Ice
  • 📅 Filter by year, month, or week
  • 🔗 Embeddable SVG — one URL drops your skyline into any README
  • 🔓 No login needed — just enter any GitHub username
  • ✅ Free and open source

Add it to your README

![GitCity](https://gitcity.natrajx.in/api/svg?username=YOUR_USERNAME)
Enter fullscreen mode Exit fullscreen mode

Try it with torvalds to see what a legendary skyline looks like:
👉 gitcity.natrajx.in/torvalds

Tech stack

Built with React, Vite, and Three.js for the 3D rendering. Deployed on Vercel. GitHub contribution data fetched via the public API — no token required.

Open source

The full source is on GitHub — PRs and feedback welcome.
👉 github.com/rishabhbhartiya/GitCity

Would love to hear what your city looks like — drop your username in the comments!

Top comments (0)