imclab / flag-webicons

Flag Webicons are flexible SVG icons of flags from every sovereign country on the planet. Hello future!

Flag Webicons Set

Flag Webicons Set is a set of resolution-independent flag icons from across the world for use on your website. They use feature-detected SVG graphics (with PNG fallbacks) to display the flags over their appropriate negatively indented anchor titles.

Flags are pulled from the list of SVG Soverign State Flags on Wikimedia Commons. If you notice a flag missing from a soverign state, submit a pull request or open an issue here on GitHub.

Enjoy Flag Webicons!

Based on FC Webicons by http://fairheadcreative.com. (Code is CC-Attrib; attrib to http://fairheadcreative.com)

Usage

1. Include flag-webicons.css in your HTML
2. Use the following code to include a flag:

<a class="flag-webicon senegal" href="http://www.gouv.sn/">République du Sénégal</a>

You can also add the following classes to change the size of the logo:

<a class="flag-webicon senegal xsmall" href="http://www.gouv.sn/">République du Sénégal</a>
<a class="flag-webicon senegal small" href="http://www.gouv.sn/">République du Sénégal</a>
<a class="flag-webicon senegal" href="http://www.gouv.sn/">République du Sénégal</a>
<a class="flag-webicon senegal large" href="http://www.gouv.sn/">République du Sénégal</a>
<a class="flag-webicon senegal xlarge" href="http://www.gouv.sn/">République du Sénégal</a>

Note that flags are kept at the aspect ratio Wikimedia Commons provides. If you need all flags to take up the same amount of space, you should specify that in your CSS.

Credits

Created by Sean Herron Based on FC Webicons by Fairhead Creative.