😊css-transform-matrix

This is a CssMatrix class as defined by the w3c CSS3 3d Transforms specification.

You can easily customize what you want with the matrix

🎉 Installation

npm install css-transform-matrix

📝 Usage

It should be compatible with documentation defined at w3.org and at WebKitCSSMatrix Safari documentation.

🚀 Example

import {CssMatrix} from "css-transform-matrix";
const matrix = new CssMatrix();
// 1. move the image down to the right by 30 pixels
matrix.move(30, 30);
// 2. enlarge the image 1.2x at (50, 50)
matrix.scaleAtPoint(1.2, 50, 50);
// 3. rotate the picture 30 degrees clockwise at (50, 50)
matrix.rotateAtPoint(30, 50, 50);
// 4. make your transform work
element.style.transform = matrix.toString();

🔧 All Methods

• move(x, y)
• moveX(x)
• moveY(y)
• scale(s)
• scaleAtPoint(s, x, y)
• scaleX(s, x)
• scaleY(s, y)
• rotate(degree)
• rotateAtPoint(degree, x, y)
• toString()