|
1 | 1 | # 🎨 CommitPulse Themes |
2 | 2 |
|
3 | | -All 13 available themes for your CommitPulse badge. Use the `?theme=<slug>` query parameter to apply a |
4 | | -theme. |
| 3 | +All 19 available themes for your CommitPulse badge. Use the `?theme=<slug>` query parameter to apply a theme. |
5 | 4 |
|
6 | 5 | ``` |
7 | | -https://commitpulse.vercel.app/api/badge?username=YOUR_USERNAME&theme=<slug> |
| 6 | +https://commitpulse.vercel.app/api/streak?user=YOUR_USERNAME&theme=<slug> |
8 | 7 | ``` |
9 | 8 |
|
10 | 9 | --- |
11 | 10 |
|
12 | 11 | ## Theme Gallery |
13 | 12 |
|
14 | | -| Theme | Background | Text | Accent | |
15 | | -| ------------ | ---------- | --------- | --------- | |
16 | | -| dark | `#0d1117` | `#c9d1d9` | `#58a6ff` | |
17 | | -| light | `#ffffff` | `#24292f` | `#0969da` | |
18 | | -| neon | `#000000` | `#00ffcc` | `#ff00ff` | |
19 | | -| github | `#0d1117` | `#ffffff` | `#39d353` | |
20 | | -| dracula | `#282a36` | `#f8f8f2` | `#bd93f9` | |
21 | | -| ocean | `#0a192f` | `#ccd6f6` | `#64ffda` | |
22 | | -| sunset | `#1a0a0a` | `#ffd6c0` | `#ff6b35` | |
23 | | -| forest | `#0d1f0d` | `#c8f0c8` | `#39d353` | |
24 | | -| rose | `#1f0d14` | `#f0c8d4` | `#ff6b9d` | |
25 | | -| nord | `#2e3440` | `#d8dee9` | `#88c0d0` | |
26 | | -| synthwave | `#0d0221` | `#f8f8f2` | `#ff2d78` | |
27 | | -| gruvbox | `#282828` | `#ebdbb2` | `#fe8019` | |
28 | | -| highcontrast | `#0a0a0a` | `#ffffff` | `#ff4500` | |
| 13 | +| Theme | Background | Text | Accent | |
| 14 | +| ---------------- | ---------- | --------- | --------- | |
| 15 | +| dark | `#0d1117` | `#c9d1d9` | `#58a6ff` | |
| 16 | +| light | `#ffffff` | `#24292f` | `#0969da` | |
| 17 | +| neon | `#000000` | `#00ffcc` | `#ff00ff` | |
| 18 | +| github | `#0d1117` | `#ffffff` | `#238636` | |
| 19 | +| dracula | `#282a36` | `#f8f8f2` | `#bd93f9` | |
| 20 | +| ocean | `#0a192f` | `#ccd6f6` | `#64ffda` | |
| 21 | +| sunset | `#1a0a0a` | `#ffd6c0` | `#ff6b35` | |
| 22 | +| forest | `#0d1f0d` | `#c8f0c8` | `#39d353` | |
| 23 | +| rose | `#1f0d14` | `#f0c8d4` | `#ff6b9d` | |
| 24 | +| nord | `#2e3440` | `#d8dee9` | `#88c0d0` | |
| 25 | +| synthwave | `#0d0221` | `#f8f8f2` | `#ff2d78` | |
| 26 | +| gruvbox | `#282828` | `#ebdbb2` | `#fe8019` | |
| 27 | +| aurora_cyberpunk | `#090B13` | `#EAF2FF` | `#9D5CFF` | |
| 28 | +| highcontrast | `#0a0a0a` | `#ffffff` | `#ff4500` | |
| 29 | +| catppuccin_latte | `#eff1f5` | `#4c4f69` | `#1e66f5` | |
| 30 | +| solarized_light | `#fdf6e3` | `#586e75` | `#268bd2` | |
| 31 | +| gruvbox_light | `#fbf1c7` | `#3c3836` | `#d65d0e` | |
| 32 | +| nord_light | `#eceff4` | `#2e3440` | `#5e81ac` | |
| 33 | +| cyber-pulse | `#000000` | `#ffffff` | `#00ffee` | |
29 | 34 |
|
30 | 35 | --- |
31 | 36 |
|
32 | | -## Preview URLs |
| 37 | +## Preview Gallery |
33 | 38 |
|
34 | | -Use these URLs to preview each theme in your README: |
| 39 | +### 🌑 Dark (default) |
35 | 40 |
|
36 | | -**dark** |
| 41 | + |
37 | 42 |
|
38 | | - |
| 43 | +| Parameter | Value | |
| 44 | +| --------- | ------ | |
| 45 | +| `bg` | 0d1117 | |
| 46 | +| `text` | c9d1d9 | |
| 47 | +| `accent` | 58a6ff | |
39 | 48 |
|
40 | | -**light** |
| 49 | +--- |
| 50 | + |
| 51 | +### ☀️ Light |
| 52 | + |
| 53 | + |
| 54 | + |
| 55 | +| Parameter | Value | |
| 56 | +| --------- | ------ | |
| 57 | +| `bg` | ffffff | |
| 58 | +| `text` | 24292f | |
| 59 | +| `accent` | 0969da | |
| 60 | + |
| 61 | +--- |
| 62 | + |
| 63 | +### ⚡ Neon |
| 64 | + |
| 65 | + |
| 66 | + |
| 67 | +| Parameter | Value | |
| 68 | +| --------- | ------ | |
| 69 | +| `bg` | 000000 | |
| 70 | +| `text` | 00ffcc | |
| 71 | +| `accent` | ff00ff | |
| 72 | + |
| 73 | +--- |
| 74 | + |
| 75 | +### 🐙 GitHub |
| 76 | + |
| 77 | + |
| 78 | + |
| 79 | +| Parameter | Value | |
| 80 | +| --------- | ------ | |
| 81 | +| `bg` | 0d1117 | |
| 82 | +| `text` | ffffff | |
| 83 | +| `accent` | 238636 | |
| 84 | + |
| 85 | +--- |
| 86 | + |
| 87 | +### 🧛 Dracula |
| 88 | + |
| 89 | + |
| 90 | + |
| 91 | +| Parameter | Value | |
| 92 | +| --------- | ------ | |
| 93 | +| `bg` | 282a36 | |
| 94 | +| `text` | f8f8f2 | |
| 95 | +| `accent` | bd93f9 | |
| 96 | + |
| 97 | +--- |
| 98 | + |
| 99 | +### 🌊 Ocean |
| 100 | + |
| 101 | + |
| 102 | + |
| 103 | +| Parameter | Value | |
| 104 | +| --------- | ------ | |
| 105 | +| `bg` | 0a192f | |
| 106 | +| `text` | ccd6f6 | |
| 107 | +| `accent` | 64ffda | |
| 108 | + |
| 109 | +--- |
| 110 | + |
| 111 | +### 🌅 Sunset |
| 112 | + |
| 113 | + |
| 114 | + |
| 115 | +| Parameter | Value | |
| 116 | +| --------- | ------ | |
| 117 | +| `bg` | 1a0a0a | |
| 118 | +| `text` | ffd6c0 | |
| 119 | +| `accent` | ff6b35 | |
| 120 | + |
| 121 | +--- |
| 122 | + |
| 123 | +### 🌲 Forest |
| 124 | + |
| 125 | + |
| 126 | + |
| 127 | +| Parameter | Value | |
| 128 | +| --------- | ------ | |
| 129 | +| `bg` | 0d1f0d | |
| 130 | +| `text` | c8f0c8 | |
| 131 | +| `accent` | 39d353 | |
| 132 | + |
| 133 | +--- |
| 134 | + |
| 135 | +### 🌸 Rose |
| 136 | + |
| 137 | + |
| 138 | + |
| 139 | +| Parameter | Value | |
| 140 | +| --------- | ------ | |
| 141 | +| `bg` | 1f0d14 | |
| 142 | +| `text` | f0c8d4 | |
| 143 | +| `accent` | ff6b9d | |
41 | 144 |
|
42 | | - |
| 145 | +--- |
| 146 | + |
| 147 | +### ❄️ Nord |
| 148 | + |
| 149 | + |
| 150 | + |
| 151 | +| Parameter | Value | |
| 152 | +| --------- | ------ | |
| 153 | +| `bg` | 2e3440 | |
| 154 | +| `text` | d8dee9 | |
| 155 | +| `accent` | 88c0d0 | |
| 156 | + |
| 157 | +--- |
| 158 | + |
| 159 | +### 🎵 Synthwave |
| 160 | + |
| 161 | + |
| 162 | + |
| 163 | +| Parameter | Value | |
| 164 | +| --------- | ------ | |
| 165 | +| `bg` | 0d0221 | |
| 166 | +| `text` | f8f8f2 | |
| 167 | +| `accent` | ff2d78 | |
| 168 | + |
| 169 | +--- |
43 | 170 |
|
44 | | -**neon** |
| 171 | +### 🪵 Gruvbox |
45 | 172 |
|
46 | | - |
| 173 | + |
47 | 174 |
|
48 | | -**github** |
| 175 | +| Parameter | Value | |
| 176 | +| --------- | ------ | |
| 177 | +| `bg` | 282828 | |
| 178 | +| `text` | ebdbb2 | |
| 179 | +| `accent` | fe8019 | |
49 | 180 |
|
50 | | - |
| 181 | +--- |
51 | 182 |
|
52 | | -**dracula** |
| 183 | +### 🔮 Aurora Cyberpunk |
53 | 184 |
|
54 | | - |
| 185 | + |
55 | 186 |
|
56 | | -**ocean** |
| 187 | +| Parameter | Value | |
| 188 | +| --------- | ------ | |
| 189 | +| `bg` | 090B13 | |
| 190 | +| `text` | EAF2FF | |
| 191 | +| `accent` | 9D5CFF | |
57 | 192 |
|
58 | | - |
| 193 | +--- |
59 | 194 |
|
60 | | -**sunset** |
| 195 | +### 🔦 High Contrast |
61 | 196 |
|
62 | | - |
| 197 | + |
63 | 198 |
|
64 | | -**forest** |
| 199 | +| Parameter | Value | |
| 200 | +| --------- | ------ | |
| 201 | +| `bg` | 0a0a0a | |
| 202 | +| `text` | ffffff | |
| 203 | +| `accent` | ff4500 | |
| 204 | + |
| 205 | +--- |
65 | 206 |
|
66 | | - |
| 207 | +### 🐱 Catppuccin Latte |
67 | 208 |
|
68 | | -**rose** |
| 209 | + |
69 | 210 |
|
70 | | - |
| 211 | +| Parameter | Value | |
| 212 | +| --------- | ------ | |
| 213 | +| `bg` | eff1f5 | |
| 214 | +| `text` | 4c4f69 | |
| 215 | +| `accent` | 1e66f5 | |
71 | 216 |
|
72 | | -**nord** |
| 217 | +--- |
73 | 218 |
|
74 | | - |
| 219 | +### 🌞 Solarized Light |
75 | 220 |
|
76 | | -**synthwave** |
| 221 | + |
77 | 222 |
|
78 | | - |
| 223 | +| Parameter | Value | |
| 224 | +| --------- | ------ | |
| 225 | +| `bg` | fdf6e3 | |
| 226 | +| `text` | 586e75 | |
| 227 | +| `accent` | 268bd2 | |
79 | 228 |
|
80 | | -**gruvbox** |
| 229 | +--- |
81 | 230 |
|
82 | | - |
| 231 | +### 🌻 Gruvbox Light |
83 | 232 |
|
84 | | -**highcontrast** |
| 233 | + |
85 | 234 |
|
86 | | - |
| 235 | +| Parameter | Value | |
| 236 | +| --------- | ------ | |
| 237 | +| `bg` | fbf1c7 | |
| 238 | +| `text` | 3c3836 | |
| 239 | +| `accent` | d65d0e | |
87 | 240 |
|
88 | 241 | --- |
89 | 242 |
|
90 | | -> 💡 **Tip:** Use `?theme=auto` to automatically switch between `light` and `dark` based on the |
91 | | -> viewer's OS setting. |
| 243 | +### 🏔️ Nord Light |
| 244 | + |
| 245 | + |
| 246 | + |
| 247 | +| Parameter | Value | |
| 248 | +| --------- | ------ | |
| 249 | +| `bg` | eceff4 | |
| 250 | +| `text` | 2e3440 | |
| 251 | +| `accent` | 5e81ac | |
| 252 | + |
| 253 | +--- |
| 254 | + |
| 255 | +### 💠 Cyber Pulse |
| 256 | + |
| 257 | + |
| 258 | + |
| 259 | +| Parameter | Value | |
| 260 | +| --------- | ------ | |
| 261 | +| `bg` | 000000 | |
| 262 | +| `text` | ffffff | |
| 263 | +| `accent` | 00ffee | |
| 264 | + |
| 265 | +--- |
| 266 | + |
| 267 | +## 🎛️ Custom Theme |
| 268 | + |
| 269 | +Not finding what you want? Build your own using raw color parameters — all values are hex codes **without** the `#` prefix: |
| 270 | + |
| 271 | +``` |
| 272 | +https://commitpulse.vercel.app/api/streak?user=YOUR_USERNAME&bg=1a1b27&text=a9b1d6&accent=7aa2f7 |
| 273 | +``` |
| 274 | + |
| 275 | +--- |
| 276 | + |
| 277 | +## 🔄 Auto Theme |
| 278 | + |
| 279 | +Automatically switches between light and dark based on the viewer's OS setting — no hex values needed: |
| 280 | + |
| 281 | +``` |
| 282 | +https://commitpulse.vercel.app/api/streak?user=YOUR_USERNAME&theme=auto |
| 283 | +``` |
| 284 | + |
| 285 | +> 💡 **Tip:** You can combine `theme=` with individual overrides. For example, `theme=dracula&accent=ff79c6` applies the Dracula theme but swaps only the accent color. |
0 commit comments