Add Github Star Icon to your project in just 1 HTML tag

Do you know you can add Github Icons like Star, Fork & others to your project in just 1 line of code?
If not, then keep reading...

You might have seen the Github star icon on many websites or projects that shows the total number of people who marked the repo as a star & clicking it redirects you to the repo where you can also mark it as a star.

Let's jump into the code

<iframe 
src="https://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=star&count=true&size=large" frameborder="0"
scrolling="0"
width="170"
height="30"
title="GitHub">
</iframe>

Live Examples

You may be thinking...

How can I customize it for my own repo? 🤔
Src attribute let you customize it, by changing query parameter key values you can make it useable for your own repo. Let's take a look at these 5 important keys of the URL-

• user - replace it with your Github Username
• repo - your repo name
• type -icon type(keep the value same)
• count - shows the number of star count(optional)
• size - for large icons(optional)

You are almost done!
But what if I want to resize the icon ?🤔
Ok, then there are also some other attributes such as width and height that are gonna help you in resizing. Don't add pixels units with width & height attribute, just add the value & then it will automatically do it for you.

🏁 Here we discussed one of the commonly used star icon, there is more than that, read more about other icons here.
If you know a better way then let me know in the comments.

Thank you for reading