7 Tips to make your GitHub profile better
Last year GitHub launched the profile feature. This feature allows GitHub users to create a ReadMe and use it as their profile to display interests, projects, and anything they might deem interesting about them and what they do.
The profile is definitely a feature that you should be using to give your GitHub a boost and to let people know a bit more about yourself, and here is how to do it and a few tips on how to make it better!
First make the profile
Making a profile is pretty simple: create a repository with the same name of your GitHub account, in my case tassiaaccioly. When creating this repository add a README, this is what will be your official profile.
Once the repository is created (make sure this repository is public!), GitHub will create a green button to the right side of the repository page saying that this is a special repository and you can make it your profile. Just click on it:
Once you click the button, this repository now is your profile, so all you have to do is edit the README file!
The first time you open it, GitHub will have some ideas for you on what to write:
But how can I do that?
Well, there are some ways. The readme files on GitHub accept both Markdown and pure HTML — when I say pure I mean with no inline styles — so to write you just have to use one or both of these languages.
GitHub has a nice section on their documentation explaining a bit about how to use Markdown:
Or, if you want a deeper knowledge of markdown:
GitHub also accepts emojis! To use them you can copy and paste the full emoji 👍 or the emoji code :thumbsup:, both work fine just choose one and go for it!
Here are two fonts for emojis, the first one is for codes and the second for the emojis themselves:
Some more tips of what to add lie ahead! Proceed at your own risk (Tl;dr)!
1. Add information about yourself
The first thing you should do on your profile is to talk a bit about yourself: who you are, what you’ve been doing, if you have some accomplishments (flaunt them!), what are the areas of technology you focus on and what is your focus on GitHub, so, the basics about you as a tech person.
Here is your place to talk more freely, you can also add gifs and images. I’ll talk about it on tip #5!
Another thing I’ve seen people with different names make, that should be added in this section, is to add an audio file showing people how to pronounce your name. This helps people say your name properly if you don’t want to keep correcting them or if they are shy on asking!
2. Contact Information
This is very important:
Give ways for people to contact you outside of GitHub.
This can be email, Twitter, LinkedIn, Facebook, Instagram, Telegram, Whatsapp, you name it. Pick at least two ways to contact you and add them to your profile.
GitHub is a child of a social network with a public repository but it makes it difficult for people to communicate amongst themselves so if someone wants to talk to you they won’t be opening issues and waiting for you to respond (they might, but let’s agree, twitter or instagram is much easier). So give them a way to talk to you that is easier than GitHub.
These ways might be added as normal links using Markdown or HTML but they can also be added as image links, with icons attached to them, as it’s own section:
Or as just images links below your name/opening phrase:
A simple way to make these icons is using a link reference on Markdown:
Some good places to find icons are Simple Icons (brands, languages and app icons), Flat Icon (miscelaneous icons), or any place you might find online! Just remember to give credit to the people who made the icons!
Also I’d suggest using svg icons because you can control their colors more easily making it easier to do a cohesive profile. I explain how to do it over on tip #5!
3. Badges
Badges are usefull to show people in a fast and organized way the languages, frameworks, libraries and technologies you know. I have a full article on how to make simple custom badges:
Some people section their badges to further organize their profiles. Depending on your area of work, some of your sections might be: Languages, Frameworks, Dev Ops, Application and Data, Bussiness Tools, Utilities, or anything you find works to showcase your habilities.
4. Status Cards
GitHub user Anurag Hazra made several status cards that you can easily add to your profile, they can show your top languages, your GitHub status, add specific repository cards to your profile and more. They also come in a lot of different styles and themes:
It’s easy to use, just read the readme and chose the cards you’d like to use. You can add them to your profile and showcase your status to the world:
You can find all the available themes here. You can also customize the cards to your liking adding or removing stats, just look in the documentation how to make it.
5. Add Images and Gifs
To add images and gifs you can use both markdown or HTML. But with HTML you can also define the image/gif size and position on the page, so most people tend to use HTML to display their images.
People can use images to illustrate some aspect of their profile but I’ve also seen many people do beautiful presentation banners of themselves and use that too, for example:
Waylon has a very impressive profile if you want to check his! He also includes some parts that update in real time, which is really nice!
One last important tip for images!
Since the end of last year, GitHub implemented on the dark mode, so be mindful of your gifs, svgs and pngs when making your profile because if someone is using dark mode and you use a black icon it will desappear! Try to find colors that work well for both dark and light mode.
One of the advantages of using svgs is that you can change their color very easily, just add a “fill” attribute to the path tag and add the color you’d like to use in any formats accepted by CSS (rgb, hex, etc), for example:
As I said before, a great source for svg/png icons to use on your profile is Simple Icons, they also include the official color for that brand/company:
Just search for the Icon you want and download it or use their link!
6. Languages/Frameworks you’ve been studying
Alongside languages and frameworks you know, you can also show in your profile that you’re continuously working on your self-improvement by adding a section with the things you’ve been studying lately.
This section will also showcase what you’re interested in right now which makes it very interesting because you can stray from just tech to other areas too if you’d like.
Again this section can be a list, various images, badges or anything you might think of. Maybe gifs? Who knows? The sky is the limit!
7. Make it your own
The most important thing about this profile is to share with people who you are, what you’re doing and how to contact you, so make your profile unique and make sure it represents who you are!
If you are very into data, maybe adding a chart or a graph would be a good idea. If you’re a more laid back jokester type of person maybe adding some gifs or a fun theme might be interesting. I saw a profile once that was all Star Wars themed and all the text were jokes with the movie theme. If you are a writer and researcher of technology maybe showing off your articles and some social numbers is a good idea!
Well, I guess you get the gist of it: make your profile you! The more you it is, the more people will connect with you!
But again, none of what I say here is set in stone, I’m improving my profile all the time, adding and removing sections, changing colors, adding and removing images. As you grow and evolve as a tech person you might change what you want to showcase, or maybe new assets (like the status card one) appear and you want to incorporate them. Have at it!
And to end this long thread, a list of many profiles you can take a look and get some inspiration:
Also this whole thread from Waylon Walker over on Dev.to with several people sharing their profiles:
If you managed to get this far I hope you use these tips and make the most of your profile on GitHub. And if you want to contact me: my GitHub and Twitter are open!
You can also follow me over on dev.to: https://dev.to/tassiaaccioly
