Invert and Mirror X and Y axis using CSS Transforms

To invert or mirror an element (text, image, etc.) you need to use the transform: scale property in CSS. You can choose to laterally (sideways) invert or vertically invert an element.

To invert laterally, use the following code:

transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);

To invert vertically:

transform: scale(1, -1);
-ms-transform: scale(1, -1);
-webkit-transform: scale(1, -1);

To invert both ways:

transform: scale(-1, -1);
-ms-transform: scale(-1, -1);
-webkit-transform: scale(-1, -1);