https://github.com/MikeCodesDotNET/ColoredBadges

Some badges I created for my GitHub profile readme.
https://github.com/MikeCodesDotNET/ColoredBadges

Last synced: about 2 months ago
JSON representation

Some badges I created for my GitHub profile readme.

• Host: GitHub
• URL: https://github.com/MikeCodesDotNET/ColoredBadges
• Owner: MikeCodesDotNET
• License: mit
• Created: 2020-07-10T15:54:40.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2024-07-29T00:44:45.000Z (5 months ago)
• Last Synced: 2024-07-31T20:28:41.784Z (4 months ago)
• Size: 8.55 MB
• Stars: 502
• Watchers: 5
• Forks: 226
• Open Issues: 47
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• Awesome-GithubProfile-README - ColoredBadges
• awesome-github-profile - ColoredBadges

README

        
# Colored Badges for GitHub profiles

I've put together some badges I for my [GitHub profile readme](https://github.com/MikeCodesDotNET) as shown below and thought they might be useful to others. 



  

    

   



---

## The Badges

All badges are available as both [SVG](https://github.com/MikeCodesDotNET/ColoredBadges/tree/master/svg) & [PNG](https://github.com/MikeCodesDotNET/ColoredBadges/tree/master/png). I've also included the original [Figma file](https://github.com/MikeCodesDotNET/ColoredBadges/raw/master/badges.fig) I used to create these should you want to change the text. 

---

## How to add a readme on your profile

It's super simple! 

Create a new repo using your GitHub username as the repo name. Voilà! 🎉🎉🎉🎉

---

## Tips for using the Icons

I'm sure you're already a pro with creating GitHub markdown documents, but I thought I'd give you a quick tip anyways.

Always try to use the SVG icons over the png. SVGs are scalable and look fabulous no matter what size device or DPI settings the viewer is using. 

You can add an SVG image with a link using the following snippet: 

```

 

    

    

```

Note how I have also provided **margins** of 6px for top and bottom and 4px for left and right. This allows the badges to have a little bit of space between them. 

### Alignment 

You can align the badges by wrapping the seconds in a paragraph tag and setting the alignment property. 

#### Left Alignment

```