Euler angles (pitch, yaw, roll) are intuitive but break down at certain orientations — axes can align and lock together, losing a degree of freedom. This is gimbal lock. Quaternions solve this by encoding a rotation as a 4D unit vector (x, y, z, w) that represents “rotate this many degrees around this axis.” They interpolate smoothly (via slerp), compose cheaply (just multiply them), and never gimbal lock. In Three.js, every Object3D stores its rotation as a quaternion internally. When you set rotation.x/y/z, Three.js converts those Euler angles into a quaternion behind the scenes — but if you work with quaternions directly, you skip the conversion and avoid edge cases entirely.
What are quaternions and why does Three.js use them?
Tags:

(Click to skip) →