CSS backface-visibility Property

CSS backface-visibility property specifies whether the back face of an element should be visible or not when it has been rotated and facing the user.

The back face of an element is basically the mirror image of element’s front face. Try out the example below to see how it works:

Example:

.div1{
  backface-visibility: hidden;
}
.div2{
  backface-visibility: visible;
}

CSS Syntax

The backface-visibility property has the below syntax:

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

Property Values

The backface-visibility property accepts the following values:

visibleThis is the default value. It specifies that the back face of the element will be visible when it’s facing the user.
hiddenSpecifies that the back face of the element will be hidden.
initialSets the backface-visibility property to its default value(visible).
inheritInherits the backface-visibility property from the parent element.

General Info

Default Valuevisible
InheritedNo
JavaScript Usageelement.style.backfaceVisibility = “hidden”;