2017-09-16 06:53:18 +00:00
[](https://www.danhendricks.com)
[](https://paypal.me/danielhendricks)
2017-09-16 07:31:56 +00:00
[](https://opensource.org/licenses/MIT)
2017-09-23 06:19:24 +00:00
[](https://packagist.org/packages/dmhendricks/file-icon-vectors)
[](https://github.com/dmhendricks/file-icon-vectors)
2017-09-17 17:19:39 +00:00
[](https://twitter.com/danielhendricks)
2017-09-16 06:53:18 +00:00
2017-09-07 00:49:11 +00:00
# File Vector Icons
2017-09-23 07:18:06 +00:00
A collection of file type vector (SVG) icons.
2017-09-16 06:53:18 +00:00
2017-09-23 01:41:04 +00:00
**This project is currently a work-in-progress.**
2017-09-07 00:49:11 +00:00
2017-09-24 05:10:15 +00:00
* If you have [feedback, bugs or requests ](https://github.com/dmhendricks/file-icon-vectors/issues ), please feel free to post them.
* I paid to license many of the icons used in these sets. [Donations ](https://paypal.me/danielhendricks ) are appreciated.
2017-09-17 17:19:39 +00:00
2017-09-23 07:18:06 +00:00
## Usage
2017-09-07 00:49:11 +00:00
2017-09-23 07:18:06 +00:00
Currently, there are two icon sets in the `icons` directory - "Classic" (which expands on the [Redbooth ](https://github.com/redbooth/free-file-icons ) designs and "Vivid" (which borrows inspiration from [Erlen Masson ](https://www.sketchappsources.com/svg-resource/1856-vector-file-type-icons-sketch-freebie-resource.html )).
To uae, simply link to one or both of the CSS files in the `css` directory.
```
< link rel = "stylesheet" href = "css/file-icon-classic.css" / >
< link rel = "stylesheet" href = "css/file-icon-vivid.css" / >
```
From there, you can use CSS classes to display the icons:
```
< span class = "fiv-cla fiv-icon-ppt" > < / span >
< span class = "fiv-cla fiv-icon-xls" > < / span >
< span class = "fiv-viv fiv-icon-pdf" > < / span >
< span class = "fiv-viv fiv-icon-wav" > < / span >
```
2017-09-24 05:21:03 +00:00
Notice that the classes contain either `flv-cla` for the Classic set or `flv-viv` for the Vivid set.
2017-09-23 07:18:06 +00:00
If you want to override the size of the icons, you can do so with CSS:
```
< style >
.fiv-cla, .fiv-viv { font-size: 3em; }
< / style >
```
2017-09-24 05:21:03 +00:00
If you prefer, you may also use `.fiv-size-md` , `.fiv-size-lg` and `.fiv-size-xl` to modify the icon sizes:
2017-09-24 05:10:15 +00:00
```
< span class = "fiv-viv fiv-icon-pdf fiv-size-lg" > < / span >
```
2017-09-23 07:18:06 +00:00
## Goals
Before I create an initial release and add these libraries to Packagist and Bower, I want to:
2017-09-26 02:21:55 +00:00
* Add additional Adobe Suite, Microsoft Office extensions
2017-09-23 07:18:06 +00:00
### Future Items
* Create a demo page for all sets
* Add the libraries to a CDN
* Add additional libraries, such as square icons, et al
2017-09-16 05:26:09 +00:00
2017-09-24 04:48:27 +00:00
## Legal Stuff
2017-09-24 20:53:01 +00:00
### Attribution
2017-09-23 01:41:04 +00:00
2017-09-24 04:35:18 +00:00
* [Android icon ](https://www.flaticon.com/free-icon/android-logo_61120 ) made by [Google ](https://www.flaticon.com/authors/google ) via [flaticon.com ](https://www.flaticon.com/ )
2017-09-26 02:21:55 +00:00
* Low-quality [BitTorrent icon ](http://www.icons101.com/icon/id_73504/setid_2388/Minimalist_Black_Icons__WIP_by_noshery/bittorrent ) made by [noshery ](http://www.icons101.com/artist/id_2388/noshery ) from [icons101.com ](http://www.icons101.com/ )
* Low-quality [GIMP Icon ](https://icons8.com/icon/39867/gimp#filled ) provided by [Icons8 LLC ](https://icons8.com/ )
