The backface-visibility proprty is used in combination with the rotated elements, and it defines whether that element will be visible (or not) when not facing the screen. In other words for the 3D transforms this property controls whether the back side of an element is visible (the default) or hidden. This property is very useful when an element is rotated, and you do not want to see its backside.


selector { 

    backface-visibility: visible | hidden | initial | inherit;



  • visible; Makes the backside visible, and is default value.
  • hidden; Hides the backside.
  • initialinherit


The example with backface-visibility property:


›› go to examples ››