|
| 1 | +# 🏅 GitHub Badges Guide |
| 2 | + |
| 3 | +GitHub badges are visual indicators you can add to your README or documentation to communicate project status, metrics, or actions — such as build status, version, license, code coverage, number of stars, and more. |
| 4 | + |
| 5 | +--- |
| 6 | + |
| 7 | +## 📌 What Are Badges? |
| 8 | + |
| 9 | +Badges are small visual tags (like shields) that can: |
| 10 | +- Indicate status (✅ Build Passing / ❌ Failing) |
| 11 | +- Show metrics (⭐ Stars, 🍴 Forks, 📦 Downloads) |
| 12 | +- Track progress (📈 Coverage, 🚧 Work In Progress) |
| 13 | +- Provide quick links (📄 License, 📂 Docs) |
| 14 | + |
| 15 | +They make repositories more professional, readable, and informative at a glance. |
| 16 | + |
| 17 | +***Please head over to the [templates file](https://github.com/openhorizonrobotics/.github/blob/main/Badges/Templates.md) to find commonly used badges that you can use in your repositories*** |
| 18 | + |
| 19 | +--- |
| 20 | + |
| 21 | +## 🔍 Where to Use Badges |
| 22 | + |
| 23 | +- At the top of your `README.md` file |
| 24 | +- In GitHub Pages documentation |
| 25 | +- In issues or pull request descriptions |
| 26 | +- Project wikis |
| 27 | + |
| 28 | +--- |
| 29 | + |
| 30 | +## 🛠️ How to Create Your Own Badges |
| 31 | + |
| 32 | +### ✅ Step 1: |
| 33 | + |
| 34 | +Go to **[https://shields.io](https://shields.io)** — the most popular and free badge generator. |
| 35 | + |
| 36 | +--- |
| 37 | + |
| 38 | +### 🧷 Static Badge |
| 39 | + |
| 40 | +These badges have fixed text and colors — they **do not update dynamically**. |
| 41 | + |
| 42 | +1. Go to [https://shields.io](https://shields.io) |
| 43 | +2. Click on **"Make your own badge"** (or scroll to the form) |
| 44 | +3. Fill in: |
| 45 | + - **Label**: What it shows on the left |
| 46 | + - **Message**: What it shows on the right |
| 47 | + - **Color**: Any valid hex or name (like `blue`, `#f03`) |
| 48 | +4. Copy the Markdown/HTML snippet provided |
| 49 | +5. For more info watch this [video](https://www.youtube.com/watch?v=4cgpu9L2AE8&t=5s) |
| 50 | +--- |
| 51 | + |
| 52 | +### 🔄 Dynamic Badge (Live Data) |
| 53 | +These update automatically with live GitHub data. |
| 54 | + |
| 55 | +Use prebuilt badge templates such as: |
| 56 | + |
| 57 | +| Badge | URL Format | |
| 58 | +| -------------- | --------------------------------------------------------- | |
| 59 | +| ⭐ Stars | `https://img.shields.io/github/stars/<user>/<repo>` | |
| 60 | +| 🍴 Forks | `https://img.shields.io/github/forks/<user>/<repo>` | |
| 61 | +| 🐛 Issues | `https://img.shields.io/github/issues/<user>/<repo>` | |
| 62 | +| 🔧 License | `https://img.shields.io/github/license/<user>/<repo>` | |
| 63 | +| 🚀 Last Commit | `https://img.shields.io/github/last-commit/<user>/<repo>` | |
| 64 | + |
| 65 | +You can find multiple such badge templates on shields.io and customise them. |
| 66 | +<img width="249" alt="image" src="https://github.com/user-attachments/assets/037d2d0f-0832-4b65-9f73-2da88186c7e8" /> |
| 67 | +<img width="275" alt="image" src="https://github.com/user-attachments/assets/4e1ca1b7-5b4a-42b2-90d3-66fed2dc3d04" /> |
| 68 | + |
| 69 | + |
| 70 | +--- |
| 71 | + |
| 72 | +**Example**: |
| 73 | + |
| 74 | + |
| 75 | + |
| 76 | +```markdown |
| 77 | + |
| 78 | +``` |
| 79 | + |
0 commit comments