Shields: Add a country flags

[WHK102]

Add a country flag, by example: Flag from Usa, Flag from Chile, Flag from Rusia powered, etc.

[chris48s]

The goal of shields.io is to provide integrations for services which are primarily used by developers or which are widely used by developers. This suggestion isn't a great fit for that mission.

While we would not want to actually generate badges that look like country flags, you can always make static badges using the flags in the emoji character set.

For example you can already do something like this:

https://img.shields.io/badge/%F0%9F%87%B3%F0%9F%87%B4%20made%20in%20norway-gray.svg

https://img.shields.io/badge/made%20in-%F0%9F%87%A7%F0%9F%87%AA%20belgium-blue.svg

[paulmelnikow]

Emoji is a nice solution for this. I'm not sure why, but they aren't rendering for me in Chrome:

Chrome:

Firefox:

[WHK102]

The goal of shields.io is to provide integrations for services which are primarily used by developers or which are widely used by developers. This suggestion isn't a great fit for that mission.

I am a developer and I would like my repository to indicate that it is an application created in Chile because in my country there are not many public developments.

Example: https://github.com/WHK102/wss

For "powered by" purposes, for example: python3 with icon for python, etc. Whats are the shields? tags?, the website says:

a service for concise, consistent, and legible badges in SVG and raster format

But it does not say exactly what the final utility is, neither on the website nor in the github repository, so its use does not exclude topics such as "powered by".

For example: You could vector in svg all the icons of font awesome (version 4) in white color ( https://fontawesome.com/v4.7.0/icons/ )

Examples:

• In donation button: https://fontawesome.com/v4.7.0/icon/paypal
• In gits links: https://fontawesome.com/v4.7.0/icon/github-alt
• Ready for steam API: https://fontawesome.com/v4.7.0/icon/steam-square
• For Wordpress plugin: https://fontawesome.com/v4.7.0/icon/wordpress
• Application for wheelchair: https://fontawesome.com/v4.7.0/icon/wheelchair
• For phone, Recycle, Android, etc etc etc.

You can made this in 1 day using:

• https://github.com/donbright/font_to_svg
• https://www.npmjs.com/package/text-to-svg

[chris48s]

We do already support the full simpleicons set, so you can already make badges like that in userspace using the static badge e.g:

https://img.shields.io/badge/powered%20by%20python-blue.svg?logo=python&logoColor=white

https://img.shields.io/badge/powered%20by%20javascript-gray.svg?logo=javascript

if you want. We also allow users to inject an arbitrary logo using a base64-encoded SVG. Given emjoi support for flag icons seems to be a bit patchy across browsers, another way to do what you want would be to use that feature to inject a custom image. For example:

https://img.shields.io/badge/made%20in%20chile-gray.svg?logo=data:image/svg%2bxml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgc3R5bGU9Ii1tcy10cmFuc2Zvcm06cm90YXRlKDM2MGRlZyk7LXdlYmtpdC10cmFuc2Zvcm06cm90YXRlKDM2MGRlZyk7dHJhbnNmb3JtOnJvdGF0ZSgzNjBkZWcpIj48cGF0aCBmaWxsPSIjZWMxYzI0IiBkPSJNMCAzMnYxMWMwIDYgMyAxMSAxMCAxMWg0NGM3IDAgMTAtNSAxMC0xMVYzMkgweiIvPjxwYXRoIGZpbGw9IiNlNmU3ZTgiIGQ9Ik01NCAxMEgyM3YyMmg0MVYyMWMwLTYtMy0xMS0xMC0xMSIvPjxwYXRoIGZpbGw9IiMyYjM5OTAiIGQ9Ik0yMyAxMEgxMEMzIDEwIDAgMTUgMCAyMXYxMWgyM1YxMHoiLz48cGF0aCBmaWxsPSIjZTZlN2U4IiBkPSJNMTIgMTRsMiA1aDVsLTQgNCAxIDUtNC0zLTUgMyAxLTUtNC00aDV6Ii8+PHBhdGggZmlsbD0icmdiYSgwLCAwLCAwLCAwKSIgZD0iTTAgMGg2NHY2NEgweiIvPjwvc3ZnPg==

:books: relevant docs: https://github.com/badges/shields/blob/master/doc/logos.md

[RedSparr0w]

Is it okay if we close this issue?

The general consensus seems to be, this is something we arent going to be implementing as it does not quite fit our guideline/mission, and there is a couple alternatives:

• use an svg logo
• use emojis _(less universal)_

[paulmelnikow]

For reasons @WHK102 explained, I think this fits the mission. I don't think we have the bandwidth to maintain svg flags within this repo, though given the issues with emojis, I'd be open to including a set of flag SVGs that were generated and maintained elsewhere.

[chris48s]

I'm not convinced on adding another icon set, be that flags or some other icon set. Incorporating SimpleIcons has probably been a net gain for us because we've used it as a way to stop accepting PRs for custom logos into core, but it also shows that pulling in an external icon set generates a non-zero maintenance/support overhead even if someone else maintains the library. Also its a very good fit for this project due to their focus on small sizes for the icons.

In theory, there are a couple of NPM packages of flag icon sets (e.g: https://www.npmjs.com/package/svg-country-flags https://www.npmjs.com/package/flag-icon-css ) which do have the advantage that someone else maintains them, but realistically they're not a good fit for this project IMO. One of the good things about shields is we typically deliver a badge in ~1Kb of SVG (admittedly a bit more with a logo). Although your simple tricolors etc are pretty small in these icon sets, more complex flags can be very large e.g:
https://github.com/hjnilsson/country-flags/blob/master/svg/es.svg (119Kb)
https://github.com/lipis/flag-icon-css/blob/master/flags/1x1/ad.svg (32Kb)
and its mostly used to encode detail that would be lost at the size we render them. You'd want quite a specialised simplified set.

Maybe if we've got hundreds of users upvoting this issue, its a topic to revisit but for the moment I reckon finding and encoding an appropriate image for their flag of choice is best left to the users who are interested in it.

One of the nice things about the custom logo feature is we don't have to include every image a user might want to use on a badge in core :)

[WHK102]

I think it would be good to sit down some time to think about the use of the service. To create the service no votes from potential users were needed (as is done in a market study), it was created to satisfy a specific need that could be of help to others. So most of my projects are to satisfy personal needs but at the same time I know that it would be useful to many more people. The flags and logos in general would be helpful to many people. If the service does not have a definition of use it is because it was created thinking about its possible utility in helping developers, as well as the icons and flags.

OVH can give you for 35 Euros a dedicated server with an excellent unlimited bandwidth. An icon on a label with good cache handling and cloudflare can significantly reduce traffic. On the contrary, having custom labels can save a lot of traffic by trying to render custom labels.