Skip to content

Commit e6f881f

Browse files
author
PoojaS-1711
committed
docs: Add complete THEMES.md gallery with all 13 themes
1 parent e15a46a commit e6f881f

1 file changed

Lines changed: 50 additions & 81 deletions

File tree

‎THEMES.md‎

Lines changed: 50 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -1,105 +1,74 @@
1-
# 🎨 CommitPulse Theme Gallery
1+
# 🎨 CommitPulse Themes
22

3-
This gallery showcases all available themes for the CommitPulse streak card.
3+
All 13 available themes for your CommitPulse badge. Use the `?theme=<slug>` query parameter to apply a theme.
44

5-
---
6-
7-
## 🌑 Neon
8-
9-
![Neon](assets/themes/neon.png)
10-
11-
Usage: `/api/streak?user=yourusername&theme=neon`
12-
13-
---
14-
15-
## 🧛 Dracula
16-
17-
![Dracula](assets/themes/dracula.png)
18-
19-
Usage: `/api/streak?user=yourusername&theme=dracula`
20-
21-
---
22-
23-
## 🌑 Dark
24-
25-
![Dark](assets/themes/dark.png)
26-
27-
Usage: `/api/streak?user=yourusername&theme=dark`
5+
```
6+
https://commitpulse.vercel.app/api/badge?username=YOUR_USERNAME&theme=<slug>
7+
```
288

299
---
3010

31-
## 🤍 Light
32-
33-
![Light](assets/themes/light.png)
34-
35-
Usage: `/api/streak?user=yourusername&theme=light`
11+
## Theme Gallery
12+
13+
| Theme | Preview | Background | Text | Accent |
14+
|-------|---------|------------|------|--------|
15+
| **dark** | ![dark](https://commitpulse.vercel.app/api/badge?username=demo&theme=dark) | `#0d1117` | `#c9d1d9` | `#58a6ff` |
16+
| **light** | ![light](https://commitpulse.vercel.app/api/badge?username=demo&theme=light) | `#ffffff` | `#24292f` | `#0969da` |
17+
| **neon** | ![neon](https://commitpulse.vercel.app/api/badge?username=demo&theme=neon) | `#000000` | `#00ffcc` | `#ff00ff` |
18+
| **github** | ![github](https://commitpulse.vercel.app/api/badge?username=demo&theme=github) | `#0d1117` | `#ffffff` | `#238636` |
19+
| **dracula** | ![dracula](https://commitpulse.vercel.app/api/badge?username=demo&theme=dracula) | `#282a36` | `#f8f8f2` | `#bd93f9` |
20+
| **ocean** | ![ocean](https://commitpulse.vercel.app/api/badge?username=demo&theme=ocean) | `#0a192f` | `#ccd6f6` | `#64ffda` |
21+
| **sunset** | ![sunset](https://commitpulse.vercel.app/api/badge?username=demo&theme=sunset) | `#1a0a0a` | `#ffd6c0` | `#ff6b35` |
22+
| **forest** | ![forest](https://commitpulse.vercel.app/api/badge?username=demo&theme=forest) | `#0d1f0d` | `#c8f0c8` | `#39d353` |
23+
| **rose** | ![rose](https://commitpulse.vercel.app/api/badge?username=demo&theme=rose) | `#1f0d14` | `#f0c8d4` | `#ff6b9d` |
24+
| **nord** | ![nord](https://commitpulse.vercel.app/api/badge?username=demo&theme=nord) | `#2e3440` | `#d8dee9` | `#88c0d0` |
25+
| **synthwave** | ![synthwave](https://commitpulse.vercel.app/api/badge?username=demo&theme=synthwave) | `#0d0221` | `#f8f8f2` | `#ff2d78` |
26+
| **gruvbox** | ![gruvbox](https://commitpulse.vercel.app/api/badge?username=demo&theme=gruvbox) | `#282828` | `#ebdbb2` | `#fe8019` |
27+
| **highcontrast** | ![highcontrast](https://commitpulse.vercel.app/api/badge?username=demo&theme=highcontrast) | `#0a0a0a` | `#888888` | `#ff4500` |
3628

3729
---
3830

39-
## 🐙 GitHub
31+
## Color Swatches
4032

41-
![GitHub](assets/themes/github.png)
33+
### dark
34+
![bg](https://img.shields.io/badge/bg-%230d1117-0d1117?style=flat-square) ![text](https://img.shields.io/badge/text-%23c9d1d9-c9d1d9?style=flat-square) ![accent](https://img.shields.io/badge/accent-%2358a6ff-58a6ff?style=flat-square)
4235

43-
Usage: `/api/streak?user=yourusername&theme=github`
36+
### light
37+
![bg](https://img.shields.io/badge/bg-%23ffffff-ffffff?style=flat-square) ![text](https://img.shields.io/badge/text-%2324292f-24292f?style=flat-square) ![accent](https://img.shields.io/badge/accent-%230969da-0969da?style=flat-square)
4438

45-
---
39+
### neon
40+
![bg](https://img.shields.io/badge/bg-%23000000-000000?style=flat-square) ![text](https://img.shields.io/badge/text-%2300ffcc-00ffcc?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23ff00ff-ff00ff?style=flat-square)
4641

47-
## 🟠 Gruvbox
42+
### github
43+
![bg](https://img.shields.io/badge/bg-%230d1117-0d1117?style=flat-square) ![text](https://img.shields.io/badge/text-%23ffffff-ffffff?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23238636-238636?style=flat-square)
4844

49-
![Gruvbox](assets/themes/gruvbox.png)
45+
### dracula
46+
![bg](https://img.shields.io/badge/bg-%23282a36-282a36?style=flat-square) ![text](https://img.shields.io/badge/text-%23f8f8f2-f8f8f2?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23bd93f9-bd93f9?style=flat-square)
5047

51-
Usage: `/api/streak?user=yourusername&theme=gruvbox`
48+
### ocean
49+
![bg](https://img.shields.io/badge/bg-%230a192f-0a192f?style=flat-square) ![text](https://img.shields.io/badge/text-%23ccd6f6-ccd6f6?style=flat-square) ![accent](https://img.shields.io/badge/accent-%2364ffda-64ffda?style=flat-square)
5250

53-
---
51+
### sunset
52+
![bg](https://img.shields.io/badge/bg-%231a0a0a-1a0a0a?style=flat-square) ![text](https://img.shields.io/badge/text-%23ffd6c0-ffd6c0?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23ff6b35-ff6b35?style=flat-square)
5453

55-
## 🌊 Ocean
54+
### forest
55+
![bg](https://img.shields.io/badge/bg-%230d1f0d-0d1f0d?style=flat-square) ![text](https://img.shields.io/badge/text-%23c8f0c8-c8f0c8?style=flat-square) ![accent](https://img.shields.io/badge/accent-%2339d353-39d353?style=flat-square)
5656

57-
![Ocean](assets/themes/ocean.png)
57+
### rose
58+
![bg](https://img.shields.io/badge/bg-%231f0d14-1f0d14?style=flat-square) ![text](https://img.shields.io/badge/text-%23f0c8d4-f0c8d4?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23ff6b9d-ff6b9d?style=flat-square)
5859

59-
Usage: `/api/streak?user=yourusername&theme=ocean`
60-
61-
---
60+
### nord
61+
![bg](https://img.shields.io/badge/bg-%232e3440-2e3440?style=flat-square) ![text](https://img.shields.io/badge/text-%23d8dee9-d8dee9?style=flat-square) ![accent](https://img.shields.io/badge/accent-%2388c0d0-88c0d0?style=flat-square)
6262

63-
## 🌅 Sunset
63+
### synthwave
64+
![bg](https://img.shields.io/badge/bg-%230d0221-0d0221?style=flat-square) ![text](https://img.shields.io/badge/text-%23f8f8f2-f8f8f2?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23ff2d78-ff2d78?style=flat-square)
6465

65-
![Sunset](assets/themes/sunset.png)
66+
### gruvbox
67+
![bg](https://img.shields.io/badge/bg-%23282828-282828?style=flat-square) ![text](https://img.shields.io/badge/text-%23ebdbb2-ebdbb2?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23fe8019-fe8019?style=flat-square)
6668

67-
Usage: `/api/streak?user=yourusername&theme=sunset`
69+
### highcontrast
70+
![bg](https://img.shields.io/badge/bg-%230a0a0a-0a0a0a?style=flat-square) ![text](https://img.shields.io/badge/text-%23888888-888888?style=flat-square) ![accent](https://img.shields.io/badge/accent-%23ff4500-ff4500?style=flat-square)
6871

6972
---
7073

71-
## 🌲 Forest
72-
73-
![Forest](assets/themes/forest.png)
74-
75-
Usage: `/api/streak?user=yourusername&theme=forest`
76-
77-
---
78-
79-
## 🌹 Rose
80-
81-
![Rose](assets/themes/rose.png)
82-
83-
Usage: `/api/streak?user=yourusername&theme=rose`
84-
85-
---
86-
87-
## ❄️ Nord
88-
89-
![Nord](assets/themes/nord.png)
90-
91-
Usage: `/api/streak?user=yourusername&theme=nord`
92-
93-
## 🌆 Synthwave
94-
95-
![Synthwave](assets/themes/synthwave.png)
96-
97-
Retro 80s-inspired palette — deep indigo background, neon pink glow, crisp white text.
98-
99-
Usage: `/api/streak?user=yourusername&theme=synthwave`
100-
101-
## 🔥 High Contrast
102-
103-
Near-black background with vivid red-orange accent and medium-grey text — maximum legibility on both solid and transparent backgrounds for low-vision accessibility.
104-
105-
Usage: `/api/streak?user=yourusername&theme=highcontrast`
74+
> 💡 **Tip:** Use `?theme=auto` to automatically switch between `light` and `dark` based on the viewer's OS setting.

0 commit comments

Comments
 (0)