〔个性主题〕github 和 gitlab 之自定义首页样式

本文已参与「新人创作礼」活动，一起开启掘金创作之路。

🎈 个性首页

相信很多小伙伴在逛 github 和 gitlab 的时候
会发现很多开发者的首页异常的炫酷，如：github.com/tinygeeker

github炫酷首页

🎈 制作步骤

是不是立马想拥有一个属于自己的高大上主页了
从上图中我们可以看出，其实它展示的一个 readme 里面的内容而已
而这个 readme 的前面路径，你会发现是跟你帐号名称是一样的
步骤 右上角+号 ► New repository ► 设置仓库信息
这个仓库名称一定要跟你的帐号名一模一样
仓库必须公开
仓库里面必须有一个 readme 文件

特定仓库

添加仓库

🎈 修改内容

接下来，我们只需要通过命令 git clone 仓库地址 拉到本地修改 readme 中的内容即可
可以看到首页右边有个统计自己仓库的图表
这是国外一个大神开发的，我们只需要引入，将其中的 username 改成自己的即可
更多设置，可以参考我的个人主页设置：github.com/tinygeeker


<h3>
  <img src="https://media.giphy.com/media/hvRJCLFzcasrR4ia7z/giphy.gif" width="25" alt="手势">
  Hi there! I'm tinygeeker~ 
  <img src="https://emojis.slackmojis.com/emojis/images/1588866973/8934/hellokittydance.gif?1588866973" alt="Hi" width="30" />
</h3>

<a href="https://github.com/tinygeeker">
  <div align="right" >
    <img align="right" src="https://count.getloli.com/get/@:tinygeeker?theme=rule34" alt="极客飞兔" />
  </div>
</a>

<!-- ======================================= -->

* 😄Read more about my [CSDN](https://tinygeeker.blog.csdn.net/)
* 👯Follow me on [阿里云](https://developer.aliyun.com/profile/expert/oirrcfhlzqzko), [掘金](https://juejin.cn/user/2467756640574845) or [腾讯云](https://cloud.tencent.com/developer/user/8345747)

<!-- https://readme-typing-svg.demolab.com/demo/ -->

![Typing SVG](https://readme-typing-svg.herokuapp.com?font=DynaPuff&size=20&pause=1000&color=9999FF&center=true&vCenter=true&width=500&height=22&lines=A+passionate+web+developer+based+in+Nanjing.++%F0%9F%91%8B)

<!-- ======================================= -->

![](https://img.shields.io/badge/-Nodejs-43853d?style=flat-square&logo=Node.js&logoColor=white) ![](https://img.shields.io/badge/-WebRTC-008000?style=flat-square&logo=WebRTC&labelColor=90EE90&color=fff) ![](https://img.shields.io/badge/-JavaScript-e5cd0c?style=flat-square&logo=JavaScript&labelColor=f7df1e&logoColor=000) ![](https://img.shields.io/badge/-TypeScript-3178C6?style=flat-square&logo=TypeScript&logoColor=white&color=blue) ![](https://img.shields.io/badge/-Vue.js-29beb0?style=flat-square&logo=vue.js&labelColor=ffffff&color=4FC08D) ![](https://img.shields.io/badge/-React-29beb0?style=flat-square&logo=React&labelColor=ffffff&color=61DAFB) ![](https://img.shields.io/badge/-WebPack-1C78C0?style=flat-square&logo=WebPack&logoColor=white) ![](https://img.shields.io/badge/-Electron-white?style=flat-square&logo=electron&logoColor=white&color=47848F) ![](https://img.shields.io/badge/-Three.js-000000?style=flat-square&logo=Three.js) ![](https://img.shields.io/badge/-MiniProgram-008000?style=flat-square&logo=WeChat&labelColor=fff&color=07C160) ![](https://img.shields.io/badge/-NPM-CB3837?style=flat-square&logo=npm&logoColor=white) ![](https://img.shields.io/badge/-Github_Actions-2088FF?style=flat-square&logo=github-actions&logoColor=white) [![](https://img.shields.io/badge/-Gist-black?style=flat-square&logo=GitHub&labelColor=blue&color=fff&logoColor=fff)](https://gist.github.com/tinygeeker) ![](https://img.shields.io/badge/-Tampermonkey-black?style=flat-square&logo=Tampermonkey&labelColor=black&color=00485B) ![](https://img.shields.io/badge/-KaliLinux-white?style=flat-square&logo=KaliLinux&logoColor=white&color=blue) ![](https://img.shields.io/badge/-MySQL-white?style=flat-square&logo=MySQL&logoColor=white&color=fff&labelColor=4479A1) ![](https://img.shields.io/badge/-CodePen-white?style=flat-square&logo=CodePen&logoColor=white&color=000) ![](https://img.shields.io/badge/-Jenkins-white?style=flat-square&logo=Jenkins&labelColor=D24939&color=white&logoColor=white) ![](https://img.shields.io/badge/-Docker-white?style=flat-square&logo=Docker&labelColor=2496ED&color=2496ED&logoColor=white) ![](https://img.shields.io/badge/-Bilibili-white?style=flat-square&logo=Bilibili&labelColor=00A1D6&logoColor=white)

<!-- ======================================= -->

##### GitHub status

![](https://github-readme-stats.vercel.app/api?username=tinygeeker&show_icons=truee&include_all_commits=true&hide=prs&card_width=1000) 

<!--

![](https://github-readme-activity-graph.cyclic.app/graph?username=tinygeeker&theme=github)
![](https://github-readme-stats.vercel.app/api?username=tinygeeker&show_icons=truee&include_all_commits=true&theme=onedark&hide=prs) 
![](https://github-readme-stats.vercel.app/api/top-langs/?username=tinygeeker&layout=compact&show_icons=truee&include_all_commits=true&theme=onedark&card_width=230)

-->

##### Some repo 

* [autocue](https://github.com/tinygeeker/autocue)：🛠️AI drawing prompter tool.(AI绘画提词工具)🧰  [![](https://img.shields.io/github/stars/tinygeeker/autocue)](https://github.com/tinygeeker/autocue)
* [python-spiders](https://github.com/tinygeeker/python-spiders)：🛠️Some crawler projects.(一些爬虫实战项目)🧰  [![](https://img.shields.io/github/stars/tinygeeker/python-spiders)](https://github.com/tinygeeker/python-spiders)
* [ChatGPT-presets](https://github.com/tinygeeker/ChatGPT-presets)：🛠️Some interesting presets for ChatGPT.(一些ChatGPT有趣的预设包)🧰  [![](https://img.shields.io/github/stars/tinygeeker/ChatGPT-presets)](https://github.com/tinygeeker/ChatGPT-presets)
* [sitemap](https://github.com/tinygeeker/sitemap)：🛠️Paddling fish website navigation.(划水摸鱼网站导航)🧰  [![](https://img.shields.io/github/stars/tinygeeker/sitemap)](https://github.com/tinygeeker/sitemap)