Have you ever come across GitHub profiles looking like this 👇👇
And you are like wow! How do they do that? You will be making your GitHub profile look beautiful and outstanding by using the steps in this article. One of the benefits of organizing your GitHub profile in this manner is that it helps show off your skills and projects to the general audience faster. You will be using the GitHub Profile README hidden feature to do this.
Step One:
Log in to your GitHub account, click on your repository and click on the new button to add a new repository. The repository name will be the same as your profile name as seen below. Make your repository public.
Tick on the ‘Add a README file’ to initialize the repo. You can now click on the ‘ Create repository’ button to create your repository.
Step Two
With one click of the 'Create repository' button, you will see the page below.
Click on the edit icon on the right-hand side, this will take you to the README page showing some GitHub markdown template as seen.
You can start editing the markdown template to whatever you wish and how you will want it to look like.
To add a badge to your profile as seen.
Go to shields.io and use the following syntax to add your badge.
![<Badge Name>](https://img.shields.io/badge/<Badge Text>-<Background Color>?style=for-the-badge&logo=<Icon Name>&logoColor=<Logo Color>)
Below is a Linkedin badge created using the above syntax.
![linkedin](https://img.shields.io/badge/Linkedin-0e76a8?style=for-the-badge&logo=Linkedin&logoColor=white)]
You can use this same procedure to add your skills/tech stack badge to your profile.
Step Three
There are a lot of open-source resources that will help you in beautifying your profile. Below are three resources you can use in adding your git stats, streak, top languages, and profile view.
GitHub Streak
DenverCoder1 / github-readme-streak-stats
🔥 Stay motivated and show off your contribution streak! 🌟 Display your total contributions, current streak, and longest streak on your GitHub profile README
Github Readme Streak Stats
Display your total contributions, current streak
and longest streak on your GitHub profile README
⚡ Quick setup
- Copy-paste the markdown below into your GitHub profile README
- Replace the value after
?user=
with your GitHub username
[![GitHub Streak](https://streak-stats.demolab.com/?user=DenverCoder1)](https://git.io/streak-stats)
- Star the repo 😄
Next Steps
-
Check out the Demo Site or Options below for available customizations.
-
It is recommended to self-host the project more better reliability. See Deploying it on your own for more details.
⚙ Demo Site
Here you can customize your Streak Stats card with a live preview.
https://streak-stats.demolab.com
🔧 Options
The user
field is the only required option. All other fields are optional.
If the theme
parameter is specified, any color customizations specified will be applied on top of the theme, overriding the theme's values.
Parameter
Details
Example
user
GitHub username to show stats for
DenverCoder1
Top Languages and Stats
anuraghazra / github-readme-stats
⚡ Dynamically generated stats for your github readmes
GitHub Readme Stats
Get dynamically generated GitHub stats on your READMEs!
View Demo · Report Bug · Request Feature · FAQ · Ask Question
Français · 简体中文 · Español · Deutsch · 日本語 · Português Brasileiro · Italiano · 한국어 · Nederlands · नेपाली · Türkçe
Please note that documentation translations may be outdated; try to use English documentation if possible.
Love the project? Please consider donating to help it improve!
Are you considering supporting the project by donating to me? Please DO NOT!!!
India has recently suffered one of the most devastating train accidents, and your help will be immensely valuable for the people who were affected by this tragedy.
Please visit this link and make a small donation to help the people in need. A small donation goes a long way. ❤️
Features
Profile View
antonkomarev / github-profile-views-counter
It counts how many times your GitHub profile has been viewed. Free cloud micro-service.
GitHub Profile Views Counter
Introduction
Try Ÿ HŸPE service as the more robust and feature rich solution.
GHPVС project is proof of concept. This counter designed to be an analytical instrument for you, but not for people who are visiting your profile It could be used to see profile views dynamics as result of development activity, blogging or taking part in a conference.
It counts how many times your GitHub profile has been viewed and displays them in your profile, for free.
Usage
Cloud solution launched as 100% free experience. Help me cut server costs if you like this service.
If you want to see big numbers in your profile, deploy a standalone solution to draw any views count you want without spamming our server. Everybody knows that any counters could be faked.
A billion fake profile views doesn't make you a very popular person, it makes you a person…
Other features you can add are:
- Trophy
- Cover picture
- Floating image or gif
- Spotify playing
- README typing SVG
- Blog post workflow
- Markdown icons
- README quotes.
The list goes on, you could browse about these features and see how to add them to your profile.
Final Note:
There is also an easy way of beautifying your Github profile by using a profile README generator profile-readme-generator. This contains all the features, all you need to do is fill in the features you want on your profile and click the ‘Generate Readme’ button, copy the code and paste it on your special repository. It's that simple. I will love to get feedback on how you created your profile and the method you used.
Top comments (0)