SVG patternContentUnits Attribute

The patternContentUnits attribute is used to indicate which coordinate system must be used for the contents of the <pattern> element.

Syntax:

patternContentUnits ="userSpaceOnUse"

// Or 

patternContentUnits ="objectBoundingBox"

Attribute Values: The patternContentUnits attribute accepts the values mentioned above and described below:

• userSpaceOnUse: It indicates that all coordinates inside the <pattern> element refer to the user coordinate system as defined when the pattern tile was created.
• objectBoundingBox: It indicates that all coordinates inside the <pattern> element are values in fractions or percentages of the bounding box of the <pattern> element.

Note: Default value is userSpaceOnUse.

Example 1: Below is the example that illustrated the use of patternContentUnits attribute using objectBoundingBox value.

Output: Below is the output generated corresponding to the above code

👁 Image

Example 2: Below is the example that illustrated the use of patternContentUnits attribute using userSpaceOnUse value.

Output: Below is the output generated corresponding to the above code

👁 Image