2017-10-15 08:05:21 +02:00
< p align = "center" >
< a href = "https://simpleicons.org/" >
< img src = "https://simpleicons.org/icons/simpleicons.svg" alt = "Simple Icons" width = 64 height = 64 >
< / a >
< h3 align = "center" > Simple Icons< / h3 >
< p align = "center" >
Free SVG icons for popular brands. See them all on one page at < a href = "https://simpleicons.org" > SimpleIcons.org< / a > . Contributions, corrections & requests can be made on GitHub. Started by < a href = "https://twitter.com/bathtype" > Dan Leech< / a > .< / p >
< / p >
2017-04-23 17:55:38 +02:00
2017-09-17 03:54:54 +02:00
## Usage
2017-04-23 17:55:38 +02:00
2017-10-15 08:09:03 +02:00
### General Usage
2017-09-17 03:54:54 +02:00
Icons can be downloaded as SVGs directly from [our website ](https://simpleicons.org/ ) - simply click the icon you want, and the download should start automatically.
2017-10-17 19:35:02 +02:00
### CDN Usage
Icons can be served from a CDN such as [JSDelivr ](https://www.jsdelivr.com/package/npm/simple-icons ) or [Unpkg ](https://unpkg.com ). Simply use the `simple-icons` npm package and specify a version in the URL like the following:
```html
2019-02-03 20:40:37 +02:00
< img height = "32" width = "32" src = "https://cdn.jsdelivr.net/npm/simple-icons@latest/icons/[ICON NAME].svg" / >
< img height = "32" width = "32" src = "https://unpkg.com/simple-icons@latest/icons/[ICON NAME].svg" / >
```
Where `[ICON NAME]` is replaced by the icon name, for example:
```html
< img height = "32" width = "32" src = "https://cdn.jsdelivr.net/npm/simple-icons@latest/icons/simpleicons.svg" / >
< img height = "32" width = "32" src = "https://unpkg.com/simple-icons@latest/icons/simpleicons.svg" / >
2017-10-17 19:35:02 +02:00
```
2017-09-17 03:54:54 +02:00
### Node Usage
The icons are also available through our npm package. To install, simply run:
```
$ npm install simple-icons
```
The API can then be used as follows:
2017-09-17 03:56:26 +02:00
```javascript
2017-09-17 03:54:54 +02:00
const simpleIcons = require('simple-icons');
2019-02-03 20:40:37 +02:00
console.log(simpleIcons['Simple Icons']);
2017-09-17 03:54:54 +02:00
/*
{
2019-02-03 20:40:37 +02:00
title: 'Simple Icons',
hex: '111111',
source: 'https://simpleicons.org/',
2018-11-06 18:10:17 +02:00
svg: '< svg role = "img" viewBox = "0 0 24 24" xmlns = "http://www.w3.org/2000/svg" > ...< / svg > '
2017-09-17 03:54:54 +02:00
}
*/
```
2017-10-15 07:25:22 +02:00
2018-08-26 23:23:57 +02:00
Alternatively you can import the needed icons individually.
This is useful if you are e.g. compiling your code with [webpack ](https://webpack.js.org/ ) and therefore have to be mindful of your package size:
2019-02-03 20:40:37 +02:00
```javascript
const icon = require('simple-icons/icons/simpleicons');
console.log(icon);
2018-08-26 23:23:57 +02:00
/*
{
2019-02-03 20:40:37 +02:00
title: 'Simple Icons',
hex: '111111',
source: 'https://simpleicons.org/',
2018-11-06 18:10:17 +02:00
svg: '< svg role = "img" viewBox = "0 0 24 24" xmlns = "http://www.w3.org/2000/svg" > ...< / svg > '
2018-08-26 23:23:57 +02:00
}
*/
```
2018-03-21 19:51:05 +02:00
## Third Party Extensions
2018-03-21 17:42:53 +02:00
2018-03-21 19:51:05 +02:00
### WordPress
Icons are also available on WordPress through a simple plugin created by [@tjtaylo ](https://github.com/tjtaylo ), which you can find [here ](https://wordpress.org/plugins/simple-icons/ ).
2018-03-21 17:42:53 +02:00
2017-10-15 07:25:22 +02:00
## Status
2017-10-15 07:39:40 +02:00
[![Build Status ](https://img.shields.io/travis/simple-icons/simple-icons/develop.svg )](https://travis-ci.org/simple-icons/simple-icons)
[![npm version ](https://img.shields.io/npm/v/simple-icons.svg )](https://www.npmjs.com/package/simple-icons)