gitHub的readme页的卡片和提交活动图的制作方法经常逛gitHub就会发现,有很多用户的介绍页面花里胡哨的各种
经常逛gitHub就会发现,有很多用户的介绍页面花里胡哨的各种 GitHub 数据卡片和徽章,今天就跟大家分享一下,这些东西怎么做!
后续我会把这些放到这个 readme-become-better 项目里了
GitHub 卡片
Github 有很多动态生成的官方统计信息,利用这些统计信息我们可以更清晰地展现个人 Github 中的提交、分类、热门等信息。
自述记录统计数据
卡片链接:https://github-readme-streak-stats.herokuapp.com?user=dongyuanwai&theme=radical
👇把下面的这段代码复制到你的README.md文档中,将username=
自己的gitHub名字,就可以得到卡片样式
<div align="center">
<img src="https://github-readme-streak-stats.herokuapp.com?user=dongyuanwai&theme=onedark&date_format=M%20j%5B%2C%20Y%5D" />
</div>
在这个网站上👉GitHub Readme Streak Stats👈您可以直接选择样式,或者自己设计颜色搭配方式
统计卡片
stats卡片链接:https://github-readme-stats.vercel.app/api?username=dongyuanwai&theme=dark&show_icons=true
👇把下面的这段代码复制到你的README.md文档中,将username=
自己的gitHub名字,就可以得到卡片样式

gitHub-readme文档可以不仅可以使用mardown语法,还支持html语法。所以你可以进行插入图片、设置位置等操作
👇把下面的这段代码复制到你的README.md文档中,将username=
自己的gitHub名字,就可以得到卡片样式
通过对卡片链接的操作,您可以进行修改theme值进行改变样式,hide隐藏图标、数据等操作
更多的内容可以查看官方的文档 👉 GitHub Readme Stats 👈
热门语言卡片
👇把下面的这段代码复制到你的README.md文档中,将username=
自己的gitHub名字,就可以得到卡片样式
提交活动图
提交活动图链接:https://activity-graph.herokuapp.com/graph?username=dongyuanwai
👇把下面的这段代码复制到你的README.md文档中,将username=
自己的gitHub名字,就可以得到卡片样式

通过对链接尾部传不同的参数,可以控制卡片的布局,和样式
👇把下面的这段代码复制到你的README.md文档中,将username=
自己的gitHub名字,就可以得到卡片样式
<div align="center">
<img src="https://activity-graph.herokuapp.com/graph?username=dongyuanwai&theme=minimal" />
</div>
你可以修改主题颜色,自定义背景色和标题名等
更多的内容可以查看官方的文档 👉 Github Readme Activity Graph 👈
数据牌-徽章
在浏览 GitHub 项目的时候,经常可以发现很多项目使用数据牌进行展示项目的数据,不仅实用,还有美化的作用
静态徽章
静态徽章链接:https://img.shields.io/badge/
👇把下面的这段代码复制到你的README.md文档中,将左面文案
-右边文案
-右边背景色
,就可以得到静态徽章样式
动态数据牌
把自己的项目地址复制进去,就可以获取到 issues
数、star
数、fork
数等
更多制作方式你可以访问它的官网👉 shields数据牌 👈
制作徽章的地址
探索
后续我会把这些放到这个 readme-become-better 项目里了
还有其他的一些更好玩的东西和教程,目前正在继续探索和发掘,
这里面有教程链接
有趣的图片和动图
转载自:https://juejin.cn/post/7097510574405189646