Shields.io Badge Maker#
“Struggling to create the perfect shields.io badge? Here’s a quick, practical guide—with real examples—to help you avoid common pitfalls and craft badges that stand out.”
| Rendered Badge | Goal | URL Structure | Key Tips |
|---|---|---|---|
 | Basic Badge | https://img.shields.io/badge/<LEFT_TEXT>-<RIGHT_TEXT>-<COLOR> | Use a valid hex color (e.g., ED8B00 for Java). If <RIGHT_TEXT> is not a color, it will appear as text. |
 | Logo Integration | ?logo=<LOGO>&logoColor=<LOGO_COLOR> | Find the correct logo name on Simple Icons. Use openjdk for Java, not java. |
 | Style: Flat | ?style=flat | Use flat for a minimalist look. |
 | Style: For the Badge | ?style=for-the-badge | Use for-the-badge for a larger, rounded style. |
 | Logo Color: Black | &logoColor=black | Use black for logos on light backgrounds. |
 | Text on Right Side | https://img.shields.io/badge/<LEFT_TEXT>-<RIGHT_TEXT>-<COLOR> | Ensure <COLOR> is a valid hex code or color name. |
 | OpenSearch Badge | https://img.shields.io/badge/OpenSearch-00BFB3?style=for-the-badge&logo=opensearch&logoColor=white | Use official brand colors for consistency (e.g., 00BFB3 for OpenSearch). |