Skip to content
Unofficial Github profile card made using github api
JavaScript CSS HTML
Branch: master
Clone or download
Latest commit adf2c88 Jul 14, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
LICENSE readme update Jul 14, 2019
card.js card language error handling added Jun 18, 2018
cardStyle.css Version bump / Multiple repositories, scrollbar added Jun 15, 2018
example.png Version bump / Multiple repositories, scrollbar added Jun 15, 2018
index.html Readme Update / index link fixed Jun 18, 2018

Github Profile Card

Unofficial Github profile card for your websites / blogs

Generator :

How to use

  • Enter your username, repository names(seprated by ",") and paste wherever you want your card to appear
    <div username='saurabhdaware' repos='github-profile-card, storm, stormv2,planetZerugoria' class='github-card' id="card"></div>
  • If you want to add all your repositories
    <div username='saurabhdaware' repos='all' class='github-card' id='card'>
  • Paste following code before the end of body tag </body> or in between your <head></head> tags
    <script src=''></script>
  • If you dont want to show repositories you can simply remove those attributes
    <div username='saurabhdaware' class='github-card' id="card"></div>

How to customize

  • These are the original styles of outer div
    margin:0 !important;
    border:1px solid black;
    font-family: 'Play', sans-serif;
    box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)
  • If your name doesn't fit perfectly in the card you can adjust the width of that card with
    width:400px !important;
  • Adding more than 3 repositories will add a scrollbar in the card if you want to remove that scrollbar you can put following in your css
    max-height:none !important;
    overflow-y: visible !important;
  • You can see full css file here If you want to change any style just overwrite them with your css


  • Input
        <!-- Other html -->
        <div username='saurabhdaware' repos='github-profile-card,storm,stormv2,planetZerugoria' class='github-card' id="card"></div>
        <!-- More html -->
        <script src=''></script>
  • Output

  • Let me know if you find any bug.
You can’t perform that action at this time.