This page is Ready to Use

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

<angle>

Summary

The <angle> CSS data type describes an amount of rotation; it is expressed with a number followed (without whitespace) by one of the recognized angle unit abbreviations.

Four angle units are available:

  • deg are degrees, of which there are 360 in a full circle.
  • grad are grades, of which there are 400 in a full circle.
  • rad are radians, of which there are 2π in a full circle.
  • turn are turns, of which one comprises a full circle.

Measurements may be positive or negative, and may extend past the limit required to specify a full circle.

If using Javascript to set or manipulate styles requiring angle measurements, it is worth mentioning that the trigonometric Math functions use radians for angles.

Examples

.a[href] {
    display: block;
    transition: transform 0.25s;
    transform: rotateX(0deg);
}
a:hover {
    /* spin link 3 times & return to original orientation */
    transform: rotateX(1080deg);
}

Related specifications

CSS Values and Units Module Level 3
Candidate Recommendation