CSS cos() Function

Definition and Usage

CSS ' cos() The function returns the cosine value of an angle.

The cosine value of the angle always returns a number between -1 and 1.

Example

Using cos() Maintain the size of the rotated box:

div.c {
  width: calc(120px * cos(25deg));
  height: calc(120px * cos(25deg));
  margin: calc(120px/4 * cos(25deg));
  background-color: maroon;
  transform: rotate(25deg);
  transform-origin: center;
  translate: -10px 10px;
}

Try It Yourself

CSS Syntax

cos(angle)

Technical Details

Browser Support

The numbers in the table represent the first browser version to fully support this function.

Related Page

Reference:CSS acos() Function

Reference:CSS asin() Function

Reference:CSS atan() Function

Reference:CSS atan2() Function

Reference:CSS calc() Function

Reference:CSS exp() Function

Reference:CSS hypot() Function

Reference:CSS log() Function

Reference:CSS mod() Function

Reference:CSS pow() Function

Reference:CSS sin() function

Reference:CSS sqrt() function

Reference:CSS tan() function