gitcolors

GitHub contributions graph in any color 🌈

A simple tool to customize your GitHub contributions graph with any color, theme, and display mode you want.

Perfect for adding a personal touch to your README — quick and easy, ready in seconds through the website.

See your graph here: https://gitcolors.vercel.app

⚡ Quick Setup

1. Go to https://gitcolors.vercel.app
2. Enter your GitHub username
3. Customize the graph
4. Copy the image
5. Paste into your README

Themes

• 🌈 Rainbow

• 🌅 Sunset

• 🌊 Wave

• 🎀 Girly

• 💻 Dev

• 🌈 Rainbow2

Without theme (any color)

• ✨ Pink

Features

• 🌈 GitHub contributions graph in any color you want
• Updates automatically based on your GitHub activity
• 🌗 Supports both light and dark themes
• ⚡ Easy to integrate into any README or portfolio
• 💻 Dedicated website to generate and view your graph
• ✨ Beautiful preset themes like Rainbow, Sunset and more
• 📊 View contributions by intensity or simply contributed / not contributed

API

You can also hit the API directly to generate the image, without going through the site:

https://gitcolors.vercel.app/api/svg?username=YOUR_USERNAME&color=HEX&theme=dark|light&mode=solid|levels&preset=rainbow|sunset|wave|girly|dev

• color — hex color, no # (used when preset isn't set)
• theme — dark or light
• mode — solid (flat color) or levels (intensity-based)
• preset — overrides color with a built-in palette (rainbow, sunset, wave, girly, dev)

🔧 Manual Setup

If you want an image that automatically switches between dark and light depending on the user's system theme, you can set it up like this:

<a href="https://gitcolors.vercel.app" target="_blank" rel="noopener">
  <picture>
    <source srcset="https://gitcolors.vercel.app/api/svg?username=a104437ana&color=ff2d95&theme=dark&mode=mono&preset=dev" media="(prefers-color-scheme: dark)" />
    <source srcset="https://gitcolors.vercel.app/api/svg?username=a104437ana&color=ff2d95&theme=light&mode=mono&preset=dev" media="(prefers-color-scheme: light)" />
    <img src="https://gitcolors.vercel.app/api/svg?username=a104437ana&color=ff2d95&theme=light&mode=mono&preset=dev" alt="a104437ana contributions" width="1000" />
  </picture>
</a>

Then just replace the values (username, color, theme, mode, preset) with whatever you'd like, following the options described in the API section above.

Support

If you like this project, please consider giving it a star ⭐

Stars