SVG <foreignObject> Element

SVG stands for Scalable Vector Graphic. It can be used to make graphics and animations like in HTML canvas.

The <foreignObject> element of SVG includes elements from a different XML namespace. It is an extensibility point which allows user agents to offer graphical rendering features beyond those which are defined within this specification. 

Syntax:

<foreignObject x = "The x coordinate of the foreignObject"
 y = "The x coordinate of the foreignObject"
 width = "The width of the foreignObject" 
 height = "The height of the foreignObject">
</foreignObject>

Attributes:

• x = The x coordinate of the foreignObject.
• y = The x coordinate of the foreignObject.
• width = The width of the foreignObject.
• height = The height of the foreignObject.

Example:

Output:

Supported Browsers:

• Chrome
• Edge
• Opera
• Internet explorer
• Safari
• Firefox