Transform















What Transform do?

Generate CSS3 Transform - Translate(X and Y): The transform translate property allows you to move an element and it's children's positions. This varies from using the left and top properties as you can have an element relative, when you translate the element it will visually move the element however, the original relative position of the element will remain the same. Left and top require you to set an element as absolute and changing the properties physically moves the element around the screen.

Generate CSS3 Transform - Rotate(Degrees): The transform rotate property allows you to rotate an element. You can set the origin of where the element will rotate from (the axis point) using the transform origin property.

Generate CSS3 Transform - Skew(A(deg) and B (deg)): The transform skew property allows you to skew an element and it's children. 1 is the normal size (1:1 scale), 0.5 = 50% of the size, 2 = twice the size.

Generate CSS3 Transform - Scale(Size): The transform rotate property allows you to scale an element and it's children. 1 is the normal size (1:1 scale), 0.5 = 50% of the size, 2 = twice the size.

Transform Style

transform-style: flat;


transform-style: preserve-3d;