Firefox Tomorrow

svg element

<feImage>

View on MDN ↗

The <feImage> SVG filter primitive fetches image data from an external source and provides the pixel data as output (meaning if the external source is an SVG image, it is rasterized.)

Usage context

Attributes

  • crossorigin
  • fetchpriority Experimental
  • preserveAspectRatio
  • href
  • xlink:href Deprecated
  • Filter primitive attributes: x, y, width, height, result

DOM Interface

This element implements the SVGFEImageElement interface.

Example

SVG

<svg
  viewBox="0 0 200 200"
  xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink"
  width="200"
  height="200">
  <defs>
    <filter id="image">
      <feImage href="mdn_logo_only_color.png" />
    </filter>
  </defs>

  <rect x="10%" y="10%" width="80%" height="80%" filter="url(#image)" />
</svg>

Result

Interactive exampleOpen the canonical MDN source to run this embedded demo.

Specifications

SpecificationsStandards references are available on the canonical MDN page.

Browser compatibility

Browser compatibilityCompatibility data is available on the canonical MDN page.

See also