Git Profileを個性豊かにする
概要
最近Git profile画面のデザインをいろいろ試したのでその方法を書いておきます。
方法
README.mdを作成
まずは自分のgitのアカウントと同じ名前のリポジトリを作成します。
私はすでにあるのでアラートが表示されますが、その下にこのリポジトリは特別だよ！README.mdをあなたのGitHub プロフィールとして使えるよと表示されます。
下のAdd a README fileにチェックをつけてリポジトリを作成する際にファイルも自動で生成されるようにしましょう。
メインの画像を追加
メインの画像は、サイズは1500x400くらいでFigmaを使って作成しました。
ディレクトリはどこでも大丈夫ですが、私はリポジトリにassetsというフォルダを作成し画像を入れてREADME.mdに以下のようにパスを追加します。
[]()
スキル・SNSのbadgeを作成
自分のスキルやSNSへのリンクをbadgeで作成することもできます。
以下のようなURLをファイルに追加することでbadgeが表示できます。
もしくはaタグで囲むこともできます。
<a href="#"><img src="https://img.shields.io/badge/HTML-1572B6?style=flat&logo=html5&logoColor=white"/></a>
badgeのURLについて
badgeのURLはこちらのサイトを使いました。他にもさまざまなbadge ジェネレーターサイトがあります。
URLの使い方をHTMLタグを例を挙げて簡単に紹介します。よりカスタマイズしたい場合は公式ドキュメントを確認ください。
https://img.shields.io/badge/HTML-1572B6?style=flat&logo=html5&logoColor=white
https://img.shields.io/badge/[badgeに表示される名前]-[badgeのcolorCode]?style=[badgeのスタイル]&logo=[アイコンの名前]&logoColor=[アイコンの色]
badgeのcolorCodeとアイコンの名前はここのサイトを利用しました。
アイコン名はサイトのアイコン名をスペースなしで使えますが、たまにアイコン表示がされない場合があるのでダウンロードリンクのアイコン名を利用すればいいと思います。
その他のツール
gitのstatsを表示してくれるジェネレーターです。色も好きにカスタマイズできる素晴らしいツールです。
詳しい使い方はこちらをご参照ください。
まとめ
一つずつ追加していくとインテリアする気分になって楽しくなります。
他の人のREADME.mdも参考にして個性豊かなgit profileを作ってみるのはいかがでしょうか。
Discussion