CSS 3D Transforms - transform-origin sample

transform-origin: 50% 0 0
transform: rotateX(45deg)

X

Y

Z

transform-origin: 0 50% 0
transform: rotateX(45deg)

X

Y

Z

transform-origin: 0 0 30px
transform: rotateX(45deg)

X

Y

Z

transform-origin: 50% 0 0 transform: rotateX(45deg)