🕌

GitHubプロフィールページを魅力的にカスタマイズする方法

に公開
GitHub
Markdown
widget
tech

はじめに

GitHubには、自分のプロフィールページをカスタマイズして自己紹介やプロジェクトをアピールできる機能があります。本記事では、以下のようなプロフィールページを作る方法を紹介します：

https://github.com/oharu121

<p align="center"> <img src="https://github-readme-stats.vercel.app/api?username=oharu121&show_icons=true&theme=radical" height="180" /> </p>

この記事でわかること：

  • GitHubプロフィールREADMEの作り方
  • 動くテキストやバッジの埋め込み方
  • スキル・プロジェクト・学習内容の見せ方
  • サンプルコード（コピーして使える）

専用リポジトリを作る

GitHubプロフィールページは、以下のルールに従ったリポジトリのREADME.mdを使って作られます。

  • リポジトリ名：自分のGitHubユーザー名と同じにする
  • https://github.com/oharu121 →　リポジトリ名はoharu121にする
  • 公開設定：Public

✅ 手順

  1. GitHubで新しいリポジトリを作成
  2. リポジトリ名に your-username を指定（例：oharu121）
  3. 「Initialize this repository with a README」にチェックを入れて作成

すると、あなたの GitHubプロフィール上に README.md の内容が表示されるようになります！

よく使うパーツの紹介

タイピング風アニメーション

<img src="https://readme-typing-svg.herokuapp.com?font=Fira+Code&color=00FFFF&size=25&center=true&vCenter=true&width=600&height=100&lines=Web+Developer;Automation+Enthusiast" />

→ 文字を変えるだけでOKです。

SNSバッジ

<img src="https://img.shields.io/badge/-LinkedIn-blue?style=flat-square&logo=Linkedin&logoColor=white" />

<p align="center">
<a href="https://www.linkedin.com/in/jefflin1201/"><img src="https://img.shields.io/badge/-LinkedIn-blue?style=flat-square&logo=Linkedin&logoColor=white" alt="LinkedIn"></a>
<a href="mailto:jefflin1201@gmail.com"><img src="https://img.shields.io/badge/-Email-D14836?style=flat-square&logo=Gmail&logoColor=white" alt="Email"></a>
<a href="https://github.com/oharu121"><img src="https://img.shields.io/badge/-GitHub-181717?style=flat-square&logo=GitHub&logoColor=white" alt="GitHub"></a>
</p>

GitHubステータス

<img src="https://github-readme-stats.vercel.app/api?username=oharu121&show_icons=true&theme=radical" />

<p align="center">
<a href="https://github.com/oharu121">
<img height="180em" src="https://github-readme-stats.vercel.app/api?username=oharu121&show_icons=true&theme=radical" alt="Yuchen's GitHub stats" />
<img height="180em" src="https://github-readme-stats.vercel.app/api/top-langs/?username=oharu121&layout=compact&theme=radical" alt="Top Languages" />
</a>
</p>

ワンポイントアドバイス

  • GitHubプロフィールはポートフォリオの入り口です。
  • 「どんな人なのか」「何ができるのか」を一目で伝えられるようにしましょう。
  • 見た目にこだわりすぎず、内容と構成のわかりやすさを重視！

まとめ

  • GitHubプロフィールREADMEは、技術と個性を伝える名刺
  • READMEは普通のMarkdownで書ける
  • リッチなUIはSVGや外部サービスで拡張可能

✨ワンポイントアドバイス

  • GitHubプロフィールはポートフォリオの入り口です。
  • 「どんな人なのか」「何ができるのか」を一目で伝えられるようにしましょう。
  • 見た目にこだわりすぎず、内容と構成のわかりやすさを重視！

👇実際のページはこちら（よかったら⭐も）：
🔗 https://github.com/oharu121

Discussion