Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/anandchowdhary/language-icons

🈹 Better icons for languages, because flags just don't cut it
https://github.com/anandchowdhary/language-icons

generator icons languages

Last synced: 13 days ago
JSON representation

🈹 Better icons for languages, because flags just don't cut it

Host: GitHub
URL: https://github.com/anandchowdhary/language-icons
Owner: AnandChowdhary
License: mit
Created: 2019-03-02T13:13:08.000Z (over 5 years ago)
Default Branch: master
Last Pushed: 2024-04-23T00:59:57.000Z (7 months ago)
Last Synced: 2024-10-04T11:56:29.848Z (about 1 month ago)
Topics: generator, icons, languages
Language: TypeScript
Homepage: https://anandchowdhary.github.io/language-icons/
Size: 273 KB
Stars: 64
Watchers: 3
Forks: 17
Open Issues: 8
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        # 🌐 Language icons

[![NPM](https://img.shields.io/npm/v/language-icons.svg)](https://www.npmjs.com/package/language-icons)

![Icon size](https://img.shields.io/github/size/AnandChowdhary/language-icons/one-color.svg.svg)

[![Build](https://img.shields.io/travis/AnandChowdhary/language-icons.svg)](https://travis-ci.org/AnandChowdhary/language-icons)

![Type definitions](https://img.shields.io/npm/types/language-icons.svg?color=brightgreen)

[![GitHub](https://img.shields.io/github/license/anandchowdhary/language-icons.svg)](https://github.com/AnandChowdhary/language-icons/blob/master/LICENSE)

![Vulnerabilities](https://img.shields.io/snyk/vulnerabilities/github/AnandChowdhary/language-icons.svg)

[Flags are not languages](http://www.flagsarenotlanguages.com/blog/), so we shouldn't use country flags as language icons.

You can use these icons instead.

They are generated using the language's ISO 639-1 code, combined with some colors. Colors are flag-inspired. For example, green/red for [Portuguese](https://unpkg.com/language-icons/icons/pt.svg), and they fallback to blue for unknown colors. If you want to color a currently blue icon, edit the [`colors.json`](https://github.com/AnandChowdhary/language-icons/blob/master/colors.json) file and make a pull request.

Each icon is an SVG, around 300 ± 10 bytes.

## 🖼️ Usage

You can use a CDN like Unpkg to embed a flag icon:

```

https://unpkg.com/language-icons/icons/LANGUAGE_CODE.svg

```

In HTML, for example:

```html



```

Icons are also available on NPM:

```bash

npm install language-icons

```

They are in the `./icons` folder, you can use an SVG loader to import them:

```js

import English from "./node_modules/language-icons/icons/en.svg"

```

## ⭐ Why

![Example of flags versus language icons](https://raw.githubusercontent.com/AnandChowdhary/language-icons/master/example.png)

## 🎨 Icons

See the list of icons: https://unpkg.com/[email protected]/icons/

![English](https://unpkg.com/language-icons/icons/en.svg)

![Hindi](https://unpkg.com/language-icons/icons/hi.svg)

![Portuguese](https://unpkg.com/language-icons/icons/pt.svg)

![German](https://unpkg.com/language-icons/icons/de.svg)

![French](https://unpkg.com/language-icons/icons/fr.svg)

![Chinese](https://unpkg.com/language-icons/icons/zh.svg)

![Spanish](https://unpkg.com/language-icons/icons/es.svg)

![Dutch](https://unpkg.com/language-icons/icons/nl.svg)

![Urdu](https://unpkg.com/language-icons/icons/ur.svg)

![](https://unpkg.com/language-icons/icons/tw.svg)

![](https://unpkg.com/language-icons/icons/sl.svg)

![](https://unpkg.com/language-icons/icons/jv.svg)

## ⚒️ Building

Install Typescript dependencies and build icons using the `npm run build` command.

## 📝 License

Icons and code, both MIT