This article is a small snippet about the **skew()** method with few examples.

**skew() method:**

which is used for tilting or skewing the elements and this method is used with the help of CSS3 **transform** property.

- skew() method tilts or skews the elements in two directions along x-axis and y-axis. and we can tilt the elements in both positive and negative direction.
`transform: skew();`

the values passed inside the skew() method should be in degrees.- Syntax for skew x-axis and skew y-axis methods

**x-axis —**transform: skewX(30deg);

**y-axis —**transform: skewY(30deg); - General syntax — transform: skew(10deg , 5deg);

first value represents x value

second value represents y value

#### examples for skew x-axis method:

See here I’m going to tilt the element in a positive x-axis direction. whenever you have a block and you want to tilt it in the positive x-axis direction.

`transform: skewX(30deg);`

**Position x value**

`transform: skewX(-30deg);`

**Negative x value**

#### examples for skew y-axis method:

See here I’m going to tilt the element in a positive y-axis direction. when ever you have a block and you want to tilt it in the positive y-axis direction.

`transform: skewY(30deg);`

**Position y value**

`transform: skewY(-30deg);`

**Negative Y value**

#### example for a general skew method:

here I’m going to tilt the element in both directions.

`transform: skew(20deg , 20deg);`

first value represents x value and second value represents y value.

`transform: skew(20deg);`

Look at the above syntax, it has only one value. now it considers the given value as x value and y value as zero by default.

**Final notes…**

skew method is one of the methods which can be used with CSS3 transform property, there are many other CSS3 methods(translate(),rotate(),scale()) which can be used with transform property.