## CSS file icons
[](#backers)
[](#sponsors)
Pure CSS file icons for popular extensions lightweight css library
## Icons
[
](https://colorswall.github.io/CSS-file-icons/)
[Demo](https://colorswall.github.io/CSS-file-icons/)
## Usage
Include `css-file-icons.css` to html or install via npm
```
npm i css-file-icons --save
```
include css file `css-file-icons.css` from folder `build`
## Example
```html
```
## File extensions
mp3, wav, aif, cda, mid, midi, mpa, mkv, ogg, wpa, wpl,
7z, zip, rar, tar.gz, pkg, z,
csv, dat, json, xml, dat, db, dbf,
sql, ns,
3ds, max, ai, psd,
ttf, woff, woff2,
png, bmp, jpg, jpeg, gif, tif, tiff, svg,
rss, torrent,
ppt, pps, pptx, odp,
asp, c, cs, java, jsp, swift, php, hh, go, py, js, html, xhtml, css, vb, rb, scss, sass, less, jsx, sh, pl,
xls, xlsx, xlsm, ods,
dll, bak, ini, dmp, sys, cfg, tmp, icns,
doc, docx, log, txt, pdf,
avi, mov, mp4, mpg, mpeg, mkv, wmv,
wps, exe.
```css
.fi.fi-*extension*
/*
where *extension* = file extension.
example: .fi.fi-doc
*/
```
## Sizes
```css
.fi.fi-size-xs
.fi.fi-size-sm // default
.fi.fi-size-md
.fi.fi-size-lg
.fi.fi-size-xl
```
## Rounded
sm, md
default border radius 0
```scss
.fi-round-sm
.fi-round-md
```
## SCSS Mixins
#### New icon color
```scss
@mixin fi-color($class, $color, $text_color:$file_icon_text_color)
```
#### Icon size
```scss
@mixin fi-size($class, $width, $height, $arrow_h, $font_size)
```
## Contributors
This project exists thanks to all the people who contribute.
## Browsers support
`CSS file icons` supports all modern browsers (Chrome, Firefox, Opera and Internet Exploer >= 9)
## Backers
Thank you to all our backers! 🙏 [[Become a backer](https://opencollective.com/CSS-file-icons#backer)]
## Sponsors
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/CSS-file-icons#sponsor)]
Created by [ColorsWall](https://colorswall.com/)