Why does CSS transform not follow the standard right-hand-rule?


#1

For example, when applying transform: rotateZ(30deg) the element rotates clockwise. Why was it chosen for CSS transform rotation to be clockwise rather than using a standard convention like the right hand rule?

In other words, why was left handedness chosen?


#2

Because rotateZ() is just rotate(), and rotate() used the standard “bearing angle” (clockwise) interpretation of angles that the rest of CSS uses. See linear-gradient(), for example.

I agree that it’s somewhat confusing to have the coordinate system be left-handed, but we had this argument back when I was defining gradients, and settled on bearing angles definitively, as they seem to be more intuitive for the average person (without strong knowledge of 3D transformations).