backface-visibilityCSS 3D Transforms環境で要素が裏返った際に裏面を描画するかどうかを制御する。hidden を指定すると、要素が180度回転して裏向きになった際にその要素が非表示となる。

カードフリップアニメーションでは表面と裏面を2枚の要素として配置し、両方に backface-visibility: hidden を設定する。表面が裏返った瞬間に消え、代わりに裏面が現れるという自然な回転効果を実現できる。

要素が90度に達した瞬間は表裏どちらもユーザーに向いていないと判定され、一瞬だけ要素が消失する「90度問題」が発生する点に注意が必要。