What’s New in Firefox 35

Here we are again. Firefox 35 was released on January 13, 2015. Few users will notice any differences but there are some exciting new features for web developers lurking under the hood of the unusually large 46MB update (on Windows). If you haven't upgraded, select Help > About Firefox from the menu or head over to firefox.com.

CSS3 filter Property

The filter property allows you to apply Photoshop-like filters on images or any element in the DOM. The effects include:

• blur(radius) -- applies a Gaussian blur


• brightness(percent) -- changes the brightness. 100% is unchanged, over 100% makes the element brighter and under 100% makes it darker (0% is complete black).


• contrast(percent) -- changes the contrast. 100% is unchanged, over 100% gives less contrast and under 100% gives more contrast (0% is complete black).


• grayscale(percent) -- converts a color image to grayscale. 0% is unchanged and 100% is full grayscale.


• sepia(percent) -- converts a color image to sepia. 0% is unchanged and 100% is full sepia.


• drop-shadow(offsetx, offsety, blur, spread, color) -- similar to the standard box-shadow effect except the shadow will apply to non-rectangular images with an alpha mask applied.


• hue-rotate(angle) -- changes the colors by the number of degrees around the color circle.


• saturate(percent) -- saturates the colors. 100% is unchanged.


• invert(percent) -- inverts the colors. 0% is unchanged and 100% creates a full negative image.


• opacity(percent) -- identical to the CSS opacity property although some browsers will provide hardware acceleration for improved performance.


• url(file.svg#target) -- specifies an SVG filter

Any number of effects can be applied in the same declaration, e.g. [code language="css"] .element { filter: blur(2%) grayscale(50%) brightness(10%); } [/code] All browsers other than Internet Explorer now support filters so I'm expecting to see an exponential increase in usage -- especially when combined with animations. For more information and examples, refer to the MDN filter reference.

Continue reading %What’s New in Firefox 35%

by Craig Buckler via SitePoint