---
title: WebKitCSSMatrix
framework: webkitjs
role: symbol
role_heading: Class
path: webkitjs/webkitcssmatrix
---

# WebKitCSSMatrix

WebKitCSSMatrix objects represent a 4x4 homogeneous matrix for 3D transforms or a vector for 2D transforms. You can use these objects to manipulate matrices in JavaScript. For example, you can multiply, translate, and scale matrices.

## Declaration

```data
interface WebKitCSSMatrix
```

## Overview

Overview The values of a 3D matrix can be initialized from the matrix3d transform function returned by window.getComputedStyle(element).webkitTransform(). To apply the final matrix to an element, construct a string using the matrix3d transform function passing the 16 values, and assign it to element.style.webkitTransform. Similarly, you can construct a matrix for 2D transforms by setting 6 values, represented by the a-f properties.

## Topics

### Accessing Properties

- [a](webkitjs/webkitcssmatrix/1633464-a.md)
- [b](webkitjs/webkitcssmatrix/1630954-b.md)
- [c](webkitjs/webkitcssmatrix/1629966-c.md)
- [d](webkitjs/webkitcssmatrix/1633079-d.md)
- [e](webkitjs/webkitcssmatrix/1633835-e.md)
- [f](webkitjs/webkitcssmatrix/1633411-f.md)
- [m11](webkitjs/webkitcssmatrix/1629449-m11.md)
- [m12](webkitjs/webkitcssmatrix/1629940-m12.md)
- [m13](webkitjs/webkitcssmatrix/1629376-m13.md)
- [m14](webkitjs/webkitcssmatrix/1632308-m14.md)
- [m21](webkitjs/webkitcssmatrix/1630988-m21.md)
- [m22](webkitjs/webkitcssmatrix/1632488-m22.md)
- [m23](webkitjs/webkitcssmatrix/1629105-m23.md)
- [m24](webkitjs/webkitcssmatrix/1633956-m24.md)
- [m31](webkitjs/webkitcssmatrix/1628844-m31.md)
- [m32](webkitjs/webkitcssmatrix/1633297-m32.md)
- [m33](webkitjs/webkitcssmatrix/1633250-m33.md)
- [m34](webkitjs/webkitcssmatrix/1630077-m34.md)
- [m41](webkitjs/webkitcssmatrix/1630945-m41.md)
- [m42](webkitjs/webkitcssmatrix/1630663-m42.md)
- [m43](webkitjs/webkitcssmatrix/1633644-m43.md)
- [m44](webkitjs/webkitcssmatrix/1631430-m44.md)

### Setting the Matrix

- [setMatrixValue](webkitjs/webkitcssmatrix/1629980-setmatrixvalue.md)

### Applying Operations

- [multiply](webkitjs/webkitcssmatrix/1631528-multiply.md)
- [inverse](webkitjs/webkitcssmatrix/1633805-inverse.md)
- [translate](webkitjs/webkitcssmatrix/1630758-translate.md)
- [scale](webkitjs/webkitcssmatrix/1632184-scale.md)
- [rotate](webkitjs/webkitcssmatrix/1629773-rotate.md)
- [rotateAxisAngle](webkitjs/webkitcssmatrix/1632317-rotateaxisangle.md)
- [skewX](webkitjs/webkitcssmatrix/1633353-skewx.md)
- [skewY](webkitjs/webkitcssmatrix/1631022-skewy.md)

### Converting the Matrix

- [toString](webkitjs/webkitcssmatrix/1630836-tostring.md)