Language Icon

You have finally found the “language icon”, the language icon is an initiative started in 2008 to standardise the language selection icon, the idea and initial icon was designed by Onur Mustak Cobanli and this new icon has been designed in 2011 by Designer Farhat Datta. Learn more or download vectors below.

Language Icon

History of the Language Icon

IdeaIn 2008, Designer Onur Mustak Cobanli and his team started building a multi-lingual, multi-national website; however there was a major interface problem: selecting the language. Visitors were having difficulty choosing a language because the platform was both multilingual and multinational; visitors had option to change both location and language but existing design solutions were not enough. Therefore, the “Language Icon” was designed to be a simple icon that could work in small pixel sizes and that could be used like the “RSS” icon but for language. The initial design was simple, and abstract which was bashed and hated by many, while receiving kudos from some. People hated because they found it “irrelevant” to the language, people hated it because “they could design better”, and people applauded it because “it was smart”.  Due to these circumstances, a design competition was launched at the A’ Design Award & Competition platform in 2011 to design a new icon to signify the language icon. Among several hundred entries, seven particular language icon candidates were filtered by the jury and these seven entries opened to public voting. In total ten thousand votes were collected and the “Turnstile Language Icon” design by Farhat Datta was announced as the winner of the Language Icon Competition in 2012. To publish and spread the word about this new language icon design, the old Language Icon website was updated. To see the previous website, as it were, click here. Read an Interview with Farhat Datta regarding the Language Icon here.

QuestionWhy do we need a Language Icon?

At 2008 when this idea of having a “Language Icon” was pushed forward, even major players such as Google, Microsoft or Yahoo did not use any unified icon to represent the language selection. Back in 2008, when you created a multi-lingual multi-national web page, you were limited to use flags or language names, or some other irrelevant icon (such as a globe image or perhaps a character in another language..) to represent language. There was no icon to signify "choose/select/switch language" or even just "language".  We wanted to create a universal icon which webmasters could use without hassle to use in their projects, which the audience could identify easily regardless of their origin or language. Of course currently in 2013, there are a few other icons designed by big players that a webmaster could rip-off and use but ours is “copyright and hassle free”, we will not disturb you for using our icon, and may we say that “we did first”, so use original “The Language Icon”.

What is the problem with flags, country or language names?

Globe IconFirst of all, when you use flags, you are mostly limited to use three or four flags for design restrictions and if your website has more than 20 languages, such as the ones we build, putting them can create a massy layout, but the main problem of using the flags for language is actually not this. Some countries has multiple languages and therefore a flag cannot represent a language; flags represents nations. A world icon does not signify language it signify location, Language names cannot signify language in foreign languages; "언어" means Language in Korean, and this means  "语言" language as well, but does it mean anything to you; if you were to open a Chinese website would you know which text is for the language? No. Therefore, language names cannot represent "language" as well. Unless you list all of languages as Wikipedia does..  


Can I use the Language Icon Freely?

Tick Yes, you can use the Language Icon for commercial and non-commercial projects; A' Design Award & Competition, who has organized the Language Icon design competition, Farhat Datta, the creator of the new Language Icon, and Onur Mustak Cobanli, the creator of the original idea hereby declare that the Language Icon is a collaborated creation released with a CC license with following terms: Relax-Attribution. You are suggested but not required to attribute the work when using for internet / digital use. You must attribute it in any other use which is not on internet. Attribute to: A’ Design Award & Competition, Onur Müştak Çobanlı and Farhat Datta with URL for non-internet usage.  Share Alike. If you alter, transform, or build upon this work, you may distribute the resulting work only under the same or similar license to this one, attribute to original author, resulting work cannot be commercial. Semi-Noncommercial. You may not use this work as a central element (or one of the core elements) for commercial purposes; Such as a design on a tshirt, on a book cover etc unless you attribute to the author. On the other hand you can use freely in your websites without attribution to signify language. Color-Firendly: You can change the colors as you like, keep the form intact please; scale proportionally. You can reverse the color or grayscale it if required.

Implementation Instructions

LanguageIconThe icon you see on the right is an example language icon. Language icon colors can be modified to fit the overall theme of your website, but we suggest making the icon strike out from other interface elements by using contrast or bright colors. The important element is to keep the icon visible and accessible.  The smallest size for the language icon is 24 x 20 pixels, a Fireworks editable PNG Source for mini icon is available in the Source-Kit. The minimum dimension is required to ensure that the icon itself is visible and thus useful for redirecting visitors to the correct languages. During your implementation refer to the following ideas: 1. Use the language icon near the language selection area in your interface. 2. Using dynamic server-side scripts or the javascript, to analyze the user language through referrers or IP, and write “Change Language” in the detected language name. 3. When the mouse is hovered to this section, it is better to pop-up all languages; foreign visitors will be able to identify their own language. 4. In your language selection box, each box should be written in its original language, if you have space include in paranthesis the language name in the current selected or default language. We do not have time to re-do all the examples, so click here for older examples where the old icon was used to demonstrate how to implement the icon.


Download the Language Icon

DownloadWe have several packs for you to download, first of all you can download the vectoral source files: either in PNG or SVG. You can also download the rar or zip archive of the language icon in different colors and sizes. These images are in raster format (zip version includes vector sources as well) and they are in a compressed archive which can be extracted by for example winrar. We also have created thousands of badges and buttons for your webpages, please feel free to download them as well. Start downloading the language icon by visiting the language icon downloads page. This page is especially kept to keep references alive. To implement the icon, we suggest you to download the source kit which includes the icon in different formats including vector and jpeg versions. As a final note, we wish to note that “You can include the icon in your commercial icon sets that you sell”, but you cannot “sell the icon itself as a solo, so do not upload to vectorstock or shutterstock or similar”, you can only sell it as a part of your bundle!.