Unfortunately, Internet Explorer does not support CSS Filters in any version.
Here is a current list of browsers that do support CSS Filters as of March 25th, 2016:
https://i.sstatic.net/e4GxU.png
For the most recent information, check out CanIUse.
While there is a polyfill available for CSS filters, it lacks support for IE 10+, older Presto-based Operas, Opera Mini, and the Android browser.
The supported filters are limited to :
- grayscale (only 0% or 100% values in IE)
- sepia (only 0% or 100% values in IE)
- blur
- invert (only 0% or 100% values in IE)
- brightness
- drop-shadow
Another Option
An alternative approach could involve using a backend language like PHP to manipulate your file.
Create an index.php
file with the following code :
<?php
// PHP code goes here
If you host this file on a server that supports PHP, you can use it like this:
<img src='http://www.example.com/hue-rotate/?src=http://example.com/image.png' />
<img src='http://www.example.com/hue-rotate/?src=http://example.com/image.png&hue-rotate=59' />
<img src='http://www.example.com/hue-rotate/?src=http://example.com/image.png&hue-rotate=95' />
<img src='http://www.example.com/hue-rotate/?src=http://example.com/image.png&hue-rotate=163' />
<img src='http://www.example.com/hue-rotate/?src=http://example.com/image.png&hue-rotate=234' />