Skip to content

Instantly share code, notes, and snippets.

@brysongilbert

brysongilbert/gist:6062276

Last active March 26, 2022 00:17
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save brysongilbert/6062276 to your computer and use it in GitHub Desktop.
Save brysongilbert/6062276 to your computer and use it in GitHub Desktop.
Download ZIP
CSS colour invert via SVG filter for Webkit, Firefox, and Internet Explorer 6-8.
Raw
gistfile1.css
/* WebKit */
-webkit-filter: invert();
/* Firefox */
filter: url("data:image/svg+xml;utf8,<svg height='0' xmlns='http://www.w3.org/2000/svg'><filter id='negative'><feColorMatrix values='-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0'/></filter></svg>#negative");
/* IE 6-7 */
filter: progid:DXImageTransform.Microsoft.BasicImage(invert=1);
/* IE 8 */
-ms-filter: 'progid:DXImageTransform.Microsoft.BasicImage(invert=1)';
@Khano
Copy link

Khano commented Nov 5, 2015

Is there a way to support IE 9 -10?

@Dok11
Copy link

Dok11 commented Jul 31, 2017

IE11 not working too

@7even11
Copy link

7even11 commented Mar 26, 2022 •
edited

/* IE9-IE11 invert all colors, including images */

body:before { content:"";position:fixed;top:100%;left:100%;z-index:9999;width:1px;height:1px;outline:2999px solid invert; }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment