https://github.com/bokub/gradgen
🌈 Dynamic Gradient Badges
https://github.com/bokub/gradgen
badge badge-generator gradient shields shieldsio
Last synced: 4 months ago
JSON representation
🌈 Dynamic Gradient Badges
- Host: GitHub
- URL: https://github.com/bokub/gradgen
- Owner: bokub
- License: mit
- Created: 2024-09-05T10:24:07.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-03-18T11:13:49.000Z (7 months ago)
- Last Synced: 2025-06-04T14:18:39.271Z (5 months ago)
- Topics: badge, badge-generator, gradient, shields, shieldsio
- Language: JavaScript
- Homepage:
- Size: 29.3 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🌈 Gradgen
> Dynamic Gradient Badges
**Gradgen** is a simple yet powerful [Cloudflare worker](https://github.com/bokub/gradgen/blob/master/index.js) that enhances your badges from [badgen.net](https://badgen.net/help) with stunning gradients.
Powered by the [gradient-badge](https://github.com/bokub/gradient-badge) library, Gradgen allows you to easily apply custom gradient effects to any badge with just a URL tweak.
## Usage
Using Gradgen is super easy
1. Head to [badgen.net](https://badgen.net/help) and generate the badge of your choice
2. Swap out the `badgen.net` in the URL with `gradgen.boris.sh`
3. Add a `gradient` query parameter with your desired colors, formatted as a comma-separated list of hex codes or [color names](https://github.com/badgen/badgen/blob/master/src/color-presets.ts)
**Optional:** Add `&style=flat` for a sleek, flat design.
## Examples
|   Description  | URL |        Result       |
| ----------------------------------- | ----------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------: |
| Original Badge | `https://badgen.net/github/checks/nodejs/node` | [![Original badge][original]][original] |
| With gradient | `https://gradgen.boris.sh/github/checks/nodejs/node?gradient=red,yellow` | [![With gradient][gradient]][gradient] |
| Flat badge | `https://gradgen.boris.sh/github/checks/nodejs/node?gradient=b65cff,11cbfa&style=flat` | [![Flat badge][flat]][flat] |
[original]: https://badgen.net/github/checks/nodejs/node
[gradient]: https://gradgen.boris.sh/github/checks/nodejs/node?gradient=red,yellow
[flat]: https://gradgen.boris.sh/github/checks/nodejs/node?gradient=b65cff,11cbfa&style=flat