css-filters-devtools-extension

CSS Filters DevTools Extension

An extension for Chrome DevTools that adds a sidebar to the Elements panel to easily edit and arrange CSS Filters.

How to install

Install the extension from the Chrome Store

Features

Supported filters:

• Blur
• Grayscale
• Brightness
• Contrast
• Sepia
• Saturation
• HueRotate
• Invert
• Opacity
• DropShadow
• Url

Add and remove Edit with sliders and input boxes Drag and drop to arrange the filter stack

TO DO

Improve color selector in drop-shadow

Credits

Inspired on Firefox's DevTools CSS filters editor

Drag and drop sort by Sortable

RegExp foo developed with regular expressions 101

MDN CSS Filter

Understanding CSS Filter Effects (HTML5Rocks)

Tested in the amazing CSSGram

License

MIT licensed

Copyright (C) 2015 Jaume Sanchez Elias @thespite, clicktorelease.com