Skip to content
Switch branches/tags

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

SE Flair

Create a nicer (HD) flair using the Stack Exchange 2.2 API

  • This uses the Stack Exchange 2.2 API which is documented here. It uses the /users/{ids} section to get the following information:

  • User display name

  • User display image

  • User badge count

  • User reputation

  • Site favicon

  • It uses an API key, available from If you do not use an API key, it will allow only 300 requests per UTC day (meaning your page can only be loaded 300 times).

  • Licensed under the Apache 2.0 License. See file LICENSE


Download the 3 files in Flair - flair.html, flair.css, flair.js.

Do a find-replace for SITENAME and replace with the name of the Stack Exchange site (e.g. meta for meta.stackexchange or askubuntu for

This must be done in both flair.html and flair.css.

In flair.html, line 6, the argumemt must change to the URL of the site (e.g. or

Also on line 6, the USERID must be changed to the user ID of your account on the site you have chosen (not your network profile id). You can find this by visiting, and looking for the numbers in the URL bar.

On line 17 of flair.js replace APIKEYHERE with your API key, or leave it blank.

Example is live here

Usage with 2 or more flairs on one page

Complete all steps above, however many times required.

Copy everything in the flair.html files into one - everything should be inside the body, at the level of the div with ID flair-SITENAME-in-here (line 8).

In the flair.css file, only the first 4 sections need duplicating.

In the body tag of flair.html is an onload= section. This must be amended to include the function call multiple times. For example, to have a flair on Meta Stack Exchange and Stackoverflow, use makeAPIRequest('meta', '', '-1'); makeAPIRequest('stackoverflow', '', '-1'). Follow the same pattern for more (semi-colon ; delimited).

Example is live here


  • Any SE site, excluding Area 51 (as it's not part of the API).
  • Jon Skeet compatible with minimal modifications.
  • Fetches all data needed, including favicon (no offline resources needed).
  • Multiple flairs on one page.
  • Fails gracefully (simply doesn't display anything) rather than an area with missing images / data and console error reporting.
  • Latest version of the API (2.2).
  • Up to 10,000 visitors per UTC day.
  • An HD Flair - better than the 208 x 58 images provided by SE, which are not retina ready.
  • You can choose where each detail goes - make a wide, a thin, a long or a fat flair, to fit your website.
  • Supports moderator diamonds at the end of names.

Thanks to the following resources


Create a nicer (HD) flair using the Stack Exchange 2.2 API




No releases published


No packages published