# Skew

Set the skew for an element.

**Widely available.** This feature is well established and works across many devices and browser versions.

Chrome 36 · Edge 12 · Firefox 16 · Safari 9

| Class | Properties | Value |
|-------|------------|-------|
| `ts:1` | transform | `skew(1deg)` |
| `ts:2` | transform | `skew(2deg)` |
| `ts:3` | transform | `skew(3deg)` |
| `ts:6` | transform | `skew(6deg)` |
| `ts:12` | transform | `skew(12deg)` |

## Skew X

| Class | Properties | Value |
|-------|------------|-------|
| `tsx:1` | transform | `skewX(1deg)` |
| `tsx:2` | transform | `skewX(2deg)` |
| `tsx:3` | transform | `skewX(3deg)` |
| `tsx:6` | transform | `skewX(6deg)` |
| `tsx:12` | transform | `skewX(12deg)` |

## Skew Y

| Class | Properties | Value |
|-------|------------|-------|
| `tsy:1` | transform | `skewY(1deg)` |
| `tsy:2` | transform | `skewY(2deg)` |
| `tsy:3` | transform | `skewY(3deg)` |
| `tsy:6` | transform | `skewY(6deg)` |
| `tsy:12` | transform | `skewY(12deg)` |

## Media Queries

Prefix a class with a breakpoint to apply it from that width up.

| Class | Properties | Value |
|-------|------------|-------|
| `ts:1` | transform | `skew(1deg)` |
| `ts:2` | transform | `skew(2deg)` |
| `ts:3` | transform | `skew(3deg)` |
| `ts:6` | transform | `skew(6deg)` |
| `ts:12` | transform | `skew(12deg)` |

## Pseudo Classes

Prefix a class with a state to apply it only while that state matches.

| Class | Properties | Value |
|-------|------------|-------|
| `ts:1` | transform | `skew(1deg)` |
| `ts:2` | transform | `skew(2deg)` |
| `ts:3` | transform | `skew(3deg)` |
| `ts:6` | transform | `skew(6deg)` |
| `ts:12` | transform | `skew(12deg)` |

## Negative Values

Double the hyphen to negate any value on the scale.

| Class | Properties | Value |
|-------|------------|-------|
| `ts:1` | transform | `skew(1deg)` |
| `ts:2` | transform | `skew(2deg)` |
| `ts:3` | transform | `skew(3deg)` |
| `ts:6` | transform | `skew(6deg)` |
| `ts:12` | transform | `skew(12deg)` |