SVG Transformation Applying Transformations

Help us to keep this website almost Ad Free! It takes only 10 seconds of your time:
> Step 1: Go view our video on YouTube: EF Core Bulk Insert
> Step 2: And Like the video. BONUS: You can also share it!

Example

Transformations can be applied to elements by adding a transform attribute:

<circle cx="0" cy="0" r="50" transform="translate(50,50)"/>

Or to groups of elements enclosed in <g> tags:

<g transform="translate(50,50)">
<circle cx="0" cy="0" r="50"/>
<circle cx="0" cy="0" r="25" fill="white"/>
</g>

More transformations can be applied to the same element by adding them separated by spaces:

<circle cx="0" cy="0" r="50" transform="translate(50,50) scale(.5)"/>


Got any SVG Question?