Badge Reference Guide

Badge Reference Guide

This document provides a comprehensive reference for badges commonly used in GitHub README files, particularly for educational and documentation projects.

Badge Services

• Shields.io: https://shields.io/ - Most popular badge service
• Badgen.net: https://badgen.net/ - Alternative badge service

Common Technology Badges

Documentation Tools

MkDocs

[![MkDocs](https://img.shields.io/badge/Made%20with-MkDocs-526CFE?logo=materialformkdocs)](https://www.mkdocs.org/)

Material for MkDocs

[![Material for MkDocs](https://img.shields.io/badge/Material%20for%20MkDocs-526CFE?logo=materialformkdocs)](https://squidfunk.github.io/mkdocs-material/)

Sphinx

[![Sphinx](https://img.shields.io/badge/Built%20with-Sphinx-blue?logo=sphinx)](https://www.sphinx-doc.org/)

Programming Languages

Python

[![Python](https://img.shields.io/badge/Python-3.8+-3776AB?logo=python&logoColor=white)](https://www.python.org/)

JavaScript

[![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?logo=javascript&logoColor=black)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)

TypeScript

[![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?logo=typescript&logoColor=white)](https://www.typescriptlang.org/)

Go

[![Go](https://img.shields.io/badge/Go-00ADD8?logo=go&logoColor=white)](https://golang.org/)

Rust

[![Rust](https://img.shields.io/badge/Rust-000000?logo=rust&logoColor=white)](https://www.rust-lang.org/)

Creative Coding & Visualization

p5.js

[![p5.js](https://img.shields.io/badge/p5.js-ED225D?logo=p5.js&logoColor=white)](https://p5js.org/)

D3.js

[![D3.js](https://img.shields.io/badge/D3.js-F9A03C?logo=d3.js&logoColor=white)](https://d3js.org/)

Chart.js

[![Chart.js](https://img.shields.io/badge/Chart.js-FF6384?logo=chartdotjs&logoColor=white)](https://www.chartjs.org/)

vis-network

[![vis-network](https://img.shields.io/badge/vis--network-blue)](https://visjs.org/)

Mermaid

[![Mermaid](https://img.shields.io/badge/Mermaid-FF3670?logo=mermaid&logoColor=white)](https://mermaid.js.org/)

AI & Machine Learning

Claude AI

[![Claude AI](https://img.shields.io/badge/Powered%20by-Claude%20AI-DA7857?logo=anthropic)](https://claude.ai)

Claude Code

[![Claude Code](https://img.shields.io/badge/Built%20with-Claude%20Code-DA7857?logo=anthropic)](https://claude.ai/code)

Claude Skills

[![Claude Skills](https://img.shields.io/badge/Uses-Claude%20Skills-DA7857?logo=anthropic)](https://github.com/dmccreary/claude-skills)

OpenAI

[![OpenAI](https://img.shields.io/badge/OpenAI-412991?logo=openai&logoColor=white)](https://openai.com/)

TensorFlow

[![TensorFlow](https://img.shields.io/badge/TensorFlow-FF6F00?logo=tensorflow&logoColor=white)](https://www.tensorflow.org/)

PyTorch

[![PyTorch](https://img.shields.io/badge/PyTorch-EE4C2C?logo=pytorch&logoColor=white)](https://pytorch.org/)

Hosting & Deployment

GitHub Pages

[![GitHub Pages](https://img.shields.io/badge/Hosted%20on-GitHub%20Pages-blue?logo=github)](SITE_URL)

Netlify

[![Netlify](https://img.shields.io/badge/Deployed%20on-Netlify-00C7B7?logo=netlify&logoColor=white)](https://www.netlify.com/)

Vercel

[![Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?logo=vercel&logoColor=white)](https://vercel.com/)

Repository & Version Control

GitHub

[![GitHub](https://img.shields.io/badge/GitHub-OWNER%2FREPO-blue?logo=github)](REPO_URL)

GitHub Stars

[![GitHub stars](https://img.shields.io/github/stars/OWNER/REPO?style=social)](https://github.com/OWNER/REPO)

GitHub Forks

[![GitHub forks](https://img.shields.io/github/forks/OWNER/REPO?style=social)](https://github.com/OWNER/REPO)

GitHub Issues

[![GitHub issues](https://img.shields.io/github/issues/OWNER/REPO)](https://github.com/OWNER/REPO/issues)

Last Commit

[![GitHub last commit](https://img.shields.io/github/last-commit/OWNER/REPO)](https://github.com/OWNER/REPO)

License Badges

Creative Commons

CC BY 4.0

[![License: CC BY 4.0](https://img.shields.io/badge/License-CC%20BY%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by/4.0/)

CC BY-SA 4.0

[![License: CC BY-SA 4.0](https://img.shields.io/badge/License-CC%20BY--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-sa/4.0/)

CC BY-NC 4.0

[![License: CC BY-NC 4.0](https://img.shields.io/badge/License-CC%20BY--NC%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc/4.0/)

CC BY-NC-SA 4.0 (Default for this project)

[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/)

CC BY-ND 4.0

[![License: CC BY-ND 4.0](https://img.shields.io/badge/License-CC%20BY--ND%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nd/4.0/)

CC BY-NC-ND 4.0

[![License: CC BY-NC-ND 4.0](https://img.shields.io/badge/License-CC%20BY--NC--ND%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-nd/4.0/)

CC0 (Public Domain)

[![License: CC0](https://img.shields.io/badge/License-CC0-lightgrey.svg)](https://creativecommons.org/publicdomain/zero/1.0/)

Open Source Licenses

MIT

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

Apache 2.0

[![License: Apache 2.0](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)

GPL-3.0

[![License: GPL v3](https://img.shields.io/badge/License-GPLv3-blue.svg)](https://www.gnu.org/licenses/gpl-3.0)

BSD 3-Clause

[![License: BSD 3-Clause](https://img.shields.io/badge/License-BSD%203--Clause-blue.svg)](https://opensource.org/licenses/BSD-3-Clause)

ISC

[![License: ISC](https://img.shields.io/badge/License-ISC-blue.svg)](https://opensource.org/licenses/ISC)

Status Badges

Build Status

[![Build Status](https://img.shields.io/badge/build-passing-brightgreen.svg)](BUILD_URL)

Coverage

[![Coverage](https://img.shields.io/badge/coverage-85%25-yellowgreen.svg)](COVERAGE_URL)

Version

[![Version](https://img.shields.io/badge/version-1.0.0-blue.svg)](RELEASES_URL)

Status

[![Status](https://img.shields.io/badge/status-active-success.svg)](PROJECT_URL)

Custom Badges

You can create custom badges using the Shields.io format:

https://img.shields.io/badge/{LABEL}-{MESSAGE}-{COLOR}

Parameters:

• LABEL: Left side text
• MESSAGE: Right side text
• COLOR: Badge color (name or hex without #)

Optional parameters:

• ?logo=LOGO_NAME: Add icon from Simple Icons
• &logoColor=COLOR: Icon color
• &style=STYLE: Badge style (flat, flat-square, plastic, for-the-badge, social)

Example custom badge:

[![Custom](https://img.shields.io/badge/Custom-Badge-orange?logo=github&logoColor=white&style=flat-square)](URL)

Badge Colors

Common color names supported by Shields.io:

• brightgreen
• green
• yellowgreen
• yellow
• orange
• red
• blue
• lightgrey
• success
• important
• critical
• informational
• inactive

Hex colors: Use without the # symbol (e.g., FF6B6B)

Logo Names

Shields.io uses logos from Simple Icons. Common logo names:

• python
• javascript
• typescript
• github
• gitlab
• visualstudiocode
• npm
• docker
• kubernetes
• react
• vue-dot-js
• angular
• node-dot-js
• postgresql
• mongodb
• redis

Best Practices

1. Order badges logically: Technology → Platform → Status → License
2. Limit badge count: 5-10 badges maximum for readability
3. Keep labels concise: Short, clear text
4. Use consistent style: Stick to one badge style (flat recommended)
5. Ensure accessibility: Use sufficient color contrast
6. Link badges appropriately: Link to relevant documentation or homepage
7. Update dynamically: Use dynamic badges (version, build status) when possible

Example Badge Section

[![MkDocs](https://img.shields.io/badge/Made%20with-MkDocs-526CFE?logo=materialformkdocs)](https://www.mkdocs.org/)
[![Material for MkDocs](https://img.shields.io/badge/Material%20for%20MkDocs-526CFE?logo=materialformkdocs)](https://squidfunk.github.io/mkdocs-material/)
[![GitHub Pages](https://img.shields.io/badge/View%20on-GitHub%20Pages-blue?logo=github)](https://username.github.io/repo-name)
[![GitHub](https://img.shields.io/badge/GitHub-username%2Frepo--name-blue?logo=github)](https://github.com/username/repo-name)
[![Claude Code](https://img.shields.io/badge/Built%20with-Claude%20Code-DA7857?logo=anthropic)](https://claude.ai/code)
[![License: CC BY-NC-SA 4.0](https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by-nc-sa/4.0/)

Resources

• Shields.io: https://shields.io/
• Simple Icons: https://simpleicons.org/
• Badge Generator: https://shields.io/badges
• Markdown Guide: https://www.markdownguide.org/