GitHubのプロフィールのカスタマイズ

概要

Githubのプロフィールのカスタマイズをしていく。

READEME.mdの作成

ユーザ名と同じレポジトリ名のレポジトリを作成し、README.mdを追加。

Top Languages Card

Top Langs

以下のコードをREADME.mdにコピペするだけ。
(●●● : ユーザ名、▲▲▲ : テーマ、★★★ : layout)

テーマはここにいっぱいある。

layoutは default と compactがある。

README.md

[![Top Langs](https://github-readme-stats.vercel.app/api/top-langs/?username=●●●&theme=▲▲▲&layout=★★★)](https://github.com/anuraghazra/github-readme-stats)

Readme Card

以下のコードをREADME.mdにコピペする。
(●●● : ユーザ名、▲▲▲ : リポジトリ、★★★ : テーマ)

README.md

[![Readme Card](https://github-readme-stats.vercel.app/api/pin/?username=●●●&repo=▲▲▲&theme=★★★)](https://github.com/●●●/▲▲▲)

GitHub Stats Card

以下のコードをREADME.mdにコピペする。
(●●● : ユーザ名、★★★ : テーマ)

README.md

![Anurag's GitHub stats]
(https://github-readme-stats.vercel.app/apiusername=●●●&show_icons=true&theme=★★★)

1列にする

以下のようにhtmlを使うと横並べにすることができる。

README.md

<p align="left"> 
  <img alt="Top Langs" height="150px" src="https://github-readme-stats.vercel.app/api/top-langs/?username=tomo1227&layout=compact&count_private=true&show_icons=true&theme=tokyonight" />
  <img alt="github stats" height="150px" src="https://github-readme-stats.vercel.app/api?username=tomo1227&count_private=true&show_icons=true&show_icons=true&theme=tokyonight" />
</p>

Github Profile Trophy

以下のコードをREADME.mdにコピペする。
(●●● : ユーザ名、★★★ : テーマ)

README.md

[![trophy](https://github-profile-trophy.vercel.app/?username=●●●&theme=★★★&column=7)](https://github.com/ryo-ma/github-profile-trophy)

Github Readme Streak Stats

以下のコードをREADME.mdにコピペする。
(●●● : ユーザ名、★★★ : テーマ)

README.md

[![](https://github-readme-streak-stats.herokuapp.com/?user=●●●&theme=★★★)](https://github-readme-streak-stats.herokuapp.com/?user=●●●&theme=★★★)

さらにカスタマイズしたいなら

下の記事が色々載ってそう。
追加したらこの記事も更新していくつもり。

1. GitHubプロフィールをクールにカスタマイズ
2. 全部無料！GitHubプロフィールの究極カスタマイズツールを厳選してみた！
3. GitHubProfileのページを可能な限りキラキラさせる方法