前言

在 GitHub 许多开源项目都有很漂亮的徽章，它们可以用来显示项目的进度，访问人数，版本信息以及 GitHub stars 数量等等，比如 kjs-common 这个项目

自定义徽章

shields 徽章可用来说明项目状态或者版本等信息，可以访问官网 https://www.shields.io/ 制作徽章，
找到 Your BADGE 自定义定制徽章，输入标签和信息，点击生成：

效果

在 markdown 可以使用 html 语法显示图标

<a href="https://tencent.cos.mobaijun.com/img/icon/avatar.jpg"><img src="https://img.shields.io/badge/alyun-%E6%B1%9F%E5%B0%8F%E7%99%BD-green" alt="博客"></a>
也可以直接编辑 URL：

1
2
3

https://img.shields.io/badge/<LABEL>-<MESSAGE>-<COLOR>.svg
# 或者
https://img.shields.io/static/v1?label=<LABEL>&message=<MESSAGE>&color=<COLOR>

参数设置

有以下几种颜色可以选择：

brightgreen、green、yellow、green、yellow、orange、red、blue、lightgrey、success、important、critical、informational、inactive、blueviolet、ff69b4、9cf

还可以配置 style 和 logo 参数

https://img.shields.io/badge/alyun-%E6%B1%9F%E5%B0%8F%E7%99%BD-green?style=social&logo=github

style 样式默认为 flat，还可以设置为 plastic、flat-square、for-the-badge 和 social。

logo 可以选择 Simple Icons：https://simpleicons.org 上提供的图标，比如微信的图标：
logo=WeChat

其他

更多玩法可到 https://shields.io/ 查阅。

设置链接

可以给徽章设置一个链接

1	[![](https://img.shields.io/badge/alyun-%E6%B1%9F%E5%B0%8F%E7%99%BD-green?style=social&logo=github)](https://alyun.vip)

或者使用 HTML 语法：

1
2
3

<p align="center">
<a href="https:/alyun.vip"><img src="https://img.shields.io/badge/alyun-%E6%B1%9F%E5%B0%8F%E7%99%BD-green?style=social&logo=github" alt=""></a>
</p>