loading...
Cover image for Show off your games using this tool

Show off your games using this tool

ananto30 profile image Azizul Haque Ananto ・1 min read

I have built this dynamic 🖼 SVG generator that collects the 🕹 games you play from Steam and generates an image that can be embedded in any site (cause all sites use html 😅). You can also put it in ⓘ .md files (like readme)! For example in GitHub profile readme, look at mine -

GitHub logo Ananto30 / Ananto30

My profile with Steam stats card




All you need is to make your Steam profile public. The steps are shown in the repo -

GitHub logo Ananto30 / steam-stat

🎮 Dynamically generate your Steam (game) stats card on SVG

Steam-stats

Steam stats svg generator. Create your own Steam stat dynamically and share anywhere.

This can be used with .md files!

You can put in your GitHub readme too 😃

Example 📝

For .md files -

![Travis](https://steam-stat.vercel.app/api?profileName=ananto)

For using as img property in html or md files -

<img src="https://steam-stat.vercel.app/api?profileName=ananto"/>

Travis

You need to provide the profile name in query parameter ?profileName=ananto.

Please ensure that your Steam profile is public!

How to get profile name or url

Go to profile Get profile name

How to make profile public

Make profile public

Contribution

Contributions are welcomed ❤️

There are many things to add, so please feel free to discuss and improve the code quality


Inspired by github-readme-stats and natemoo-re




I am attaching the following line in this blog post and it will dynamically generate the SVG every time someone visits this page!

![Travis](https://steam-stat.vercel.app/api?profileName=ananto)
Enter fullscreen mode Exit fullscreen mode

Result -
Travis

(Obviously this has some caching to reduce spamming the Steam API 😛)

Please give it a ⭐️ star if you like it. 😃
Suggest any further improvements and contributions are also welcomed. 👏
Share your profile in the comment! 👇

Discussion

pic
Editor guide