<image>

The <image> SVG element allows a raster image to be included in an SVG document.

Usage context

Categories	Graphics element, Graphics referencing element
Permitted content	Any number of the following elements, in any order: Animation elements Descriptive elements

Attributes

Global attributes

• Conditional processing attributes
• Core attributes
• Graphical event attributes
• Presentation attributes
• Xlink attributes
• class
• style
• externalResourcesRequired
• transform

Specific attributes

• x
• y
• width
• height
• xlink:href
• preserveAspectRatio

DOM Interface

This element implements the SVGImageElement interface.

Example

Basic rendering of a PNG image in an SVG object:

<svg width="100%" height="100%" viewBox="0 0 100 100"
     xmlns="http://www.w3.org/2000/svg" 
     xmlns:xlink="http://www.w3.org/1999/xlink">       
  <image xlink:href="/files/6457/mdn_logo_only_color.png" x="0" y="0"
      height="100" width="100" />    
</svg>

Specifications

Specification	Status	Comment
Scalable Vector Graphics (SVG) 2 The definition of '<image>' in that specification.	Candidate Recommendation
Scalable Vector Graphics (SVG) 1.1 (Second Edition) The definition of '<image>' in that specification.	Recommendation	Initial definition

Browser compatibility

The chart is based on these sources.

[1] Prior to Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) only raster images were supported.