How to invert web pages colour scheme in Firefox?

In WebKit based browsers, you can add the following style to achieve color inversion:

html { -webkit-filter: invert(); }

Sadly, we're currently waiting for the implementation in Firefox: https://developer.mozilla.org/en-US/docs/CSS/filter#Browser_compatibility

An equivalent in Firefox would look like:

html {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'invert\'><feColorMatrix type=\'matrix\' values=\'-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0\'/></filter></svg>#invert");
}

The results aren't anywhere near as nice though:

Bonus

Here's the bookmarklet for WebKit (requires jQuery to be loaded):

javascript:$("html").css("-webkit-filter","invert()")

Make a bookmarklet with the following URL:

javascript:void(document.getElementsByTagName('html')[0].style.webkitFilter='invert()');