Element CSS Transform is a Booster Addons extension that can be enabled on any Elementor section, column or widget. This extension allows you to visually manipulate an element by translating, rotating, scaling, or skewing.
1. Head to the edit section, column or widget.
2. Click on the Advanced tab.
3. Now head to Booster CSS Transform and enable the extension. You can also enable the hover CSS Transform if you want to apply it as a hover effect.
Â
The Element CSS Transform can be applied for both the normal and hover states for any elementor section, column or widget. Here are the options.
-Translate X : This control can be used to move the element horizontally. A positive number for movement to the right, and a negative number for a movement to the left.
-Translate Y : This control can be used to move the element vertically. A positive number for movement to the bottom, and a negative number for a movement to the top.
-Rotate X : Rotate the element around the X axis. Positive number is equal to rotating to the top, negative number for rotating to the bottom.
-Rotate Y : Rotate the element around the Y axis. Positive number is equal to rotating to the right, negative number for rotating to the left.
-Rotate Z : Rotate the element around the Z axis. Positive number is equal to rotating to the right, negative number for rotating to the left.
-Scale X : This control can be used to scale the element horizontally.
-Scale Y : This control can be used to scale the element vertically.
-Skew X : This can be used to create a horizontal distortion effect. Positive number is equal to a distortion to the left, a negative number to the right.
-Skew Y : This can be used to create a vertical distortion effect. Positive number is equal to a distortion to the top, a negative number to the bottom.