DEV Community

Cover image for 7 Tips on making your GitHub profile better
Tassia Accioly
Tassia Accioly

Posted on

7 Tips on making 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:

Alt Text
from GitHub

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:

Alt Text
from vibhorchaudhary

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:

https://docs.github.com/en/free-pro-team@latest/github/writing-on-github/basic-writing-and-formatting-syntax

Or, if you want a deeper knowledge of markdown:

https://daringfireball.net/projects/markdown/syntax

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:

https://www.webfx.com/tools/emoji-cheat-sheet/

https://emojipedia.org/

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 to your profile showing how to pronounce your name, this helps people say your name properly if you don’t want to keep correcting them!

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:

Alt Text

Or as just images links below your name/opening phrase:

Alt Text

A simple way to make these icons is using a link reference on Markdown:

Alt Text
this also allows the images to have some space between them

Some good places to find icons are Simple Icons (brands, languages and app icons), Flaticon (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:

GitHub logo anuraghazra / github-readme-stats

⚡ Dynamically generated stats for your github readmes

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 to see:

Alt Text
here I'm using the compact layout and the Great Gatsby theme

You can find all the available themes here. You can also customize the cards to your liking adding or removing stats.

5. Add Images and Gifs

To add images and gifs to your profile 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.

Alt Text

People can use images to illustrate some aspects of their profile but I’ve also seen many people do beautiful presentation banners of themselves and use that, for example:

GitHub logo WaylonWalker / WaylonWalker

Learning in public

waylon walker header

        

Hey there 👋,

I create blog posts and open source packages mainly about python and data engineering. I have a passion for learning and sharing my knowledge with others in a way that's as public as possible. You can see a full list of what I am up to on waylonwalker.com. If you found value in something I have created, please feel free to send a tip, give me a shout out @_waylonwalker, give some on DEV.to/waylonwalker, or sign up for my newsletter at waylonwalker.com/newsletter I would love to see you join.





Boy Scout Rule

I love open source. I am not a heavy maintainer of any large libraries, but I really like the boyscout rule. I contribute to things as I come across issues that I think other people might struggle with. This may be things that are overlooked by someone who is…




Waylon has a very impressive README 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:

Alt Text

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:

GitHub logo coderjojo / creative-profile-readme

A Collection of GitHub Profiles with awesome readme

Also this whole thread from Waylon Walker 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 medium: https://tassiaaccioly.medium.com

Top comments (0)