Get dynamically generated Code::Stats stats on your readmes!
Copy paste this into your markdown content, and that's it. Simple!
Change the ?username= value to your GitHub's username.
[](https://github.com/Aviortheking/codestats-readme)| Option Name | Preview | Description |
|---|---|---|
| hide | Hide specific line, ex: &hide=xp or &hide=xp,recent_xp |
|
| show_icons | shows icons before each lines ex: &show_icons |
|
| hide_rank | hide the rank circle ex: &hide_rank |
|
| line_height | change the line Height of each lines, ex: &line_height=45 |
|
| icon_color | change the icons color, ex: &icon_color=123456&show_icons |
|
| text_color | change the text colors, ex: &text_color=123456 |
Shows your XP history as it's shown on your profile.
Copy-paste this code into your readme and change the links.
Endpoint: api/history?username=Aviortheking
[](https://github.com/aviortheking/codestats-readme)| Option Name | Preview | Description |
|---|---|---|
| layout | Change the layout to the horizontal one ex: &layout=horizontal |
|
| height | Change the height of the card Only on horizontal layout ex: &height=400Default: 300 |
|
| width | Change the width of the card Only on vertical layout ex: &width=TypeScriptDefault: 500 |
|
| title | Change the title of the card ex: &title=History |
|
| days_count | Change the number of days shown ex: &days_count=7 Default: 14 |
|
| reverse_order | Reverse the order of the days ex: &reverse_order |
|
| hide | Hide specifics languages and put them in Others ex: &hide=TypeScript |
|
| language_count | Change the number of languages shown before going to Others ex: &language_count=3defaults: 8 |
|
| text_color | change the text colors ex: &text_color=654321 |
Top languages card shows user's top languages.
Copy-paste this code into your readme and change the links.
Endpoint: api/top-langs?username=aviortheking
[](https://github.com/aviortheking/codestats-readme)| Option Name | Preview | Description |
|---|---|---|
| hide | Hide Specific language ex: &hide=TypeScript or &hide=TypeScript,TypeScript%20(JSX) |
|
| language_count | Change the number of languages shown before going to Others ex: &language_count=3defaults: 8 |
|
| card_width | hide the rank circle ex: &card_width=600defaults: 300 |
|
| layout | make the layout more compact ex: &layout=compact |
|
| text_color | change the text colors ex: &text_color=654321 |
| Options Name | Preview | Description |
|---|---|---|
| title_color | Change the title color ex: &title_color=654321 |
|
| bg_color | Change the background color ex: &bg_color=654321 |
|
| hide_border | Hide the border ex: &hide_border |
|
| hide_title | Hide the title ex: &hide_border |
|
| theme | See #themes | |
| cache_seconds | set the cache header manually (min: 1800, max: 86400) ex: &cache_seconds=86400Default: 1800 or 30 minutes |
With inbuilt themes you can customize the look of the card without doing any manual customization.
Use ?theme=THEME_NAME parameter like so :-
dark, radical, merko, gruvbox, tokyonight, onedark, cobalt, synthwave, highcontrast, dracula
You can look at a preview for all available themes or checkout the theme config file & you can also contribute new themes if you like :D
You usually won't be able to layout the images side by side. To do that you can use this approach:
<a href="https://github.com/aviortheking/codestats-readme">
<img align="center" src="https://codestats-readme.avior.me/api?username=aviortheking" />
</a>
<a href="https://github.com/aviortheking/codestats-readme">
<img align="center" src="https://codestats-readme.avior.me/api/top-langs/?username=aviortheking" />
</a>- Build the Docker image
docker build . --tag your-tag - run the Docker image
docker run your-tag - Profit on the port 3000!
Contributions are welcomed! <3
Made with ❤️ and Typescript.