# skewY function

The `skewY` function sets a skew of an element along the Y-axis, turning it into a parallelogram. It is used together with the `transform` property. The property value is an angle in any angle units. The angle can be either positive or negative. A positive value makes the skew upwards, a negative value - downwards. The skew is performed around the point specified by the `transform-origin` property.

## Syntax

`selector { transform: skewY(angle); }`

## Example

In this example, the block is skewed upwards by `30` degrees:

`<div id="elem">lorem ipsum</div>` `#elem { transform: skewY(30deg); border: 1px solid black; width: 100px; height: 50px; }`

:

## Example

In this example, the block is skewed downwards by `30` degrees:

`<div id="elem">lorem ipsum</div>` `#elem { transform: skewY(-30deg); border: 1px solid black; width: 100px; height: 50px; }`

:

## See also

- the `skew` function
  that sets a skew along the X- and Y-axes
- the `skewX` function
  that sets a skew along the X-axis

← →
↑
en ru