Updated to provide an image rather than embedded content:

Good looking, higher quality Stack Exchange flairs!

About:

SEFlair is an HTML, CSS and JavaScript app which you can include on your website.

I created it because the flairs provided by Stack Exchange are:

  1. not customizable (the elements are fixed in the image)
  2. not HD (less than 200px - and they look pretty bad on retina displays).

This is for anyone who wants to show off their flair on their website.

It uses the /users/{ids}/ API V2.2 to fetch Reputation, Badge Counts, Display Name and your Display Image. It also fetches the favicon of the site.

Screenshot / Code Snippet:

Download / Install:

The code is available on GitHub - timtjtim/SEFlair

Platform:

This is embedded into your website. It should work on all browsers, including IE 9+. JavaScript is required (but if disabled, it fails gracefully).

Contact:

I created this code, and am the only contributor. You can email me at contact@timtjtim.co.uk or you can open an issue on GitHub

License:

MIT - see licence at GitHub - timtjtim/SEFlair/LICENSE

Code: (recommended)

This was written with HTML, CSS, JavaScript.

If you wish to contribute, open a pull request on GitHub - timtjtim/SEFlair

  • Wait, and how do you use it? – nicael Jun 12 '16 at 18:13
  • @nicael insert the code into your webpage. There are detailed instructions on the GitHub README – Tim Jun 12 '16 at 18:15
  • 3
    Ok, but why haven't you included the usage instructions in the question, that's weird. – nicael Jun 12 '16 at 18:16
  • Ah, so it can't be used as you do it with the SE flair? – nicael Jun 12 '16 at 18:17
  • @nicael I left them out because it's one place to update not two when I change the README. And it can go anywhere you have access to the css, js and html – Tim Jun 12 '16 at 18:20

You must log in to answer this question.

Browse other questions tagged .