Loading...

Transform properties

Set the X,Y and Z rotation, X, Y and Z translation, X and Y scale, X and Y skew and X and Y origin to transform an element's shape.

X-rotate

Set the rotation of the element on the x-axis. 

Expected value:

  • Enter a number. This will be interpreted as degrees

Accepted units:

  • Blank - The value will be interpreted as deg

Y-rotate

Set the rotation of the element on the y-axis. 

Expected value:

  • Enter a number. This will be interpreted as degrees

Accepted units:

  • Blank - The value will be interpreted as deg

Z-rotate

Set the rotation of the element on the z-axis. 

Expected value:

  • Enter a number. This will be interpreted as degrees

Accepted units:

  • Blank - The value will be interpreted as deg

X-translate

Move the element on the x-axis. Positive numbers move the element down. Negative numbers move the element up.

Expected value:

  • Enter a number
  • Negative numbers are accepted

Accepted units:

  • Blank - The value will be interpreted as px

Y-translate

Move the element on the y-axis. Positive numbers move the element right. Negative numbers move the element left.

Expected value:

  • Enter a number
  • Negative numbers are accepted

Accepted units:

  • Blank - The value will be interpreted as px

Z-translate

Move the element on the z-axis. Positive numbers move the element away from the viewer (Element appears smaller). Negative numbers move the element towards the viewer (Element appears bigger)

Expected value:

  • Enter a number
  • Negative numbers are accepted

Accepted units:

  • Blank - The value will be interpreted as px

X-scale

Scale the element on the x-axis. Positive numbers make the element wider.

Expected value:

  • Enter a number

Accepted units:

  • Blank - The value will be interpreted as px

Y-scale

Scale the element on the y-axis. Positive numbers make the element taller.

Expected value:

  • Enter a number

Accepted units:

  • Blank - The value will be interpreted as px

X-skew

Skew the element on the x-axis in degrees.

Expected value:

  • Enter a number

Accepted units:

  • Blank - The value will be interpreted as deg

Y-skew

Skew the element on the y-axis in degrees.

Expected value:

  • Enter a number

Accepted units:

  • Blank - The value will be interpreted as deg

X-origin

Set the position the element is transformed from on the x-axis. Default value is 50%. This is equivalent to centre.

Expected value:

  • Enter a number - This will be interpreted as px
  • Enter a string
    • Left
    • Centre
    • Right

Accepted units:

  • Blank - The value will be interpreted as px
  • % - The values will be applied as a percentage of the element's width. 50% is centre

Y-origin

Set the position the element is transformed from on the y-axis. Default value is 50%. This is equivalent to centre.

Expected value:

  • Enter a number - This will be interpreted as px
  • Enter a string
    • Top
    • Centre
    • Bottom

Accepted units:

  • Blank - The value will be interpreted as px
  • % - The values will be applied as a percentage of the element's height. 50% is centre

Did not find what you were looking for?

If this content did not answer your questions, try searching or contacting our support team for further assistance.

Back to Section navigation