css-file-icons

CSS file icons


Pure CSS file icons for popular extensions lightweight css library

Icons

Demo

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

doc

`

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]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]

Created by ColorsWall