websiteuno / SVG-FILTERS

:crystal_ball: Fildrop. A set of custom SVG Filters

FILDROP

Fildrop is a set of custom SVG filters. Build with Drag & Drop, postCSS, noUiSlider.

DEMO

##Filters to customize

You can customize someone filters. The filter will be customized if have an icon at top-right of the button.

##How to use

Download FILDROP. The first thing you need to do is include the CSS and the SVG in your project. You can include the filters at the bottom of HTML. I prefer include the file at my images folder.

<link rel="stylesheet" href="path/to/filter.css">

Add class to the element

<img class="saturate" src="path/to/image.png">

You can view all filter effects in this demo

Classes:

• saturotate
• saturate
• rotamatrix
• multitable
• tablen
• dishue
• matrix
• matrix-dos
• huerotate
• luminance
• discrete
• discrete-dos
• table
• table-dos
• identity
• linear
• gamma
• turbulence
• sepia
• fematrix-uno
• fematrix-dos
• turbu-map
• map-uno
• map-dos
• blur-uno
• blur-dos
• morpho-uno
• morpho-dos

##Browser support

• Internet Explorer 10+
• Chrome 8+
• Firefox 3+
• Opera 10+
• Safari 6+

CanIuse

##Contributing

To contribute to FILDROP, clone this repo locally, create your awesome filters and create pull request with your filter.

##License

Fildrop is licensed under the MIT license

##Credits

Matthew Bystedt

David Dailey

WebPlatform SVG FILTER

W3C