Page cover

๐Ÿ–Œ๏ธStyles

Types of Badges

Shields.io has 5 different styles of buttons, including:

Types
Styles

1

Plastic

2

Flat-Square

3

Flat

4

Social

5

For The Badge

This project uses Flat badges for the sake of simplicity, similar to how markdown-badges uses For The Badge badges for theirs.

If you want to change the style of your badge, add the following code into your badge:

Plastic:

style=plastic

Example: ![GitHub](https://img.shields.io/badge/GitHub-%23121011.svg?style=plastic&logo=github&logoColor=white)

Result:

Flat Square:

style=flat-square

Example: ![YouTube](https://img.shields.io/badge/YouTube-%23FF0000.svg?style=flat-square&logo=YouTube&logoColor=white)

Result:

Flat:

style=flat

Example: ![Twitch](https://img.shields.io/badge/Twitch-%239146FF.svg?style=flat&logo=Twitch&logoColor=white)

Result:

Social

style=social

Example: ![GitHub repo watchers](https://img.shields.io/github/watchers/badges/shields.svg?style=social)

Result:

For The Badge

style=for-the-badge

Example: ![Spotify](https://img.shields.io/badge/Spotify-1ED760?style=for-the-badge&logo=spotify&logoColor=white)

Result:

Last updated

Was this helpful?