filter()

The filter() CSS function applies one or more graphic effects to a CSS image, such as a background image. You can use functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, background: filter(url(image.png), blur(2px)).

Baseline Status: This feature is currently Limited and is missing in at least one major browser engine.

Desktop Browser Engine Support

Google Chrome

—

Unsupported

Mozilla Firefox

—

Unsupported

Apple Safari

9.1

Supported

Microsoft Edge

—

Unsupported

Mobile Browser Engine Support

Chrome Android

—

Firefox Android

—

Safari iOS

9.3

Specifications and References

Specification ↗ Can I Use (css-filter-function) ↗ Feature XML ↗

MDN Browser Compat Data Keys:

css.types.image.filter ↗