The Transform record contains everything about transformations. You probably won't use it as is, but instead using Box.transform which automatically generate an empty Transform record. You can then use modifiers. I.E.

Box.transform
    [ Transform.translateX (px 30)
    , Transform.translateY (vw 30)
    ]

Generate an empty Translate record, with every field equal to Nothing. You are free to use it as you wish, but it is instanciated automatically by Box.translate.

Set the translateX of the Transform.

Set the translateY of the Transform.

Set the translateZ of the Transform.

Set the rotateX of the Transform.

Set the rotateY of the Transform.

Set the translateZ of the Transform.

Set the origin of the Transform.

in a (css) 3d rendered scene, we hide back facing elements.

in a (css) 3d rendered scene, we show back facing elements.

in a (css) 3d rendered scene, we hide back facing elements.

Change the perspective of a scene. It represents the distance between the z=0 plane and the user in order to give a 3D-positioned element some perspective. Each 3D element with z>0 becomes larger; each 3D-element with z<0 becomes smaller. The strength of the effect is determined by the value of this property.

Define the origin of the perspective of a scene. It represents the position at which the viewer is looking. It is used as the vanishing point by the perspective property.

Compiles a Transform record to the corresponding CSS tuple. Compiles only parts which are defined, ignoring Nothing fields.