Free online CSS 3D transform generator. Visually control rotateX/Y/Z, translateX/Y/Z, scale, and perspective. Real-time 3D preview, one-click copy CSS code. Perfect for frontend developers creating 3D animations and effects. Client-side only.
使用CSS 3D变换需要在父元素上设置perspective（透视）属性来启用3D空间。transform-style: preserve-3d可以让子元素在3D空间中定位，backface-visibility控制背面可见性。所有现代浏览器都支持CSS 3D变换。
rotateX绕水平轴（X轴）旋转，产生上下翻转效果；rotateY绕垂直轴（Y轴）旋转，产生左右翻转效果；rotateZ绕Z轴（屏幕平面垂直方向）旋转，类似于2D旋转。组合使用可以创建复杂的3D立体效果。
perspective值定义了观察者到Z=0平面的距离。值越小（如200px），透视效果越强，变形越明显；值越大（如1000px），透视效果越柔和，变形越小。一般800-1200px是较自然的范围。