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

# 概要

https://github.com/tomo1227

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

# READEME.mdの作成

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

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/156096/1cb3b84c-6924-0f57-884d-fd67f916daf5.png)

# Top Languages Card

## Top Langs

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

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

テーマは[ここ](https://github.com/anuraghazra/github-readme-stats/blob/master/themes/README.md)にいっぱいある。

layoutは **default** と **compact**がある。

```md: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 Card](https://github-readme-stats.vercel.app/api/pin/?username=tomo1227&repo=pathy&theme=cobalt)](https://github.com/tomo1227/pathy)

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

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

## GitHub Stats Card

![Anurag's GitHub stats](https://github-readme-stats.vercel.app/api?username=tomo1227&show_icons=true&theme=solarized-light)

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

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

## 1列にする

<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>

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

```md: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

[![trophy](https://github-profile-trophy.vercel.app/?username=tomo1227&theme=onedark&column=7)](https://github.com/tomo1227/github-profile-trophy)

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

```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

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

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


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

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

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

1. [GitHubプロフィールをクールにカスタマイズ](https://paiza.hatenablog.com/entry/2022/07/06/160000)
1. [全部無料！GitHubプロフィールの究極カスタマイズツールを厳選してみた！](https://paiza.hatenablog.com/entry/2022/07/06/160000)
1. [GitHubProfileのページを可能な限りキラキラさせる方法](https://zenn.dev/yutakatay/articles/kirakira-github-profile)