title: Is a css transform matrix equivalent to a transform scale, skew, translate
body: <p>Are css <b>transform matrix</b> and <b>transform scale, skew, translate</b> equivalent?</p>
  <p>According to <a href="https://stackoverflow.com/questions/21469502/how-do-i-use-the-matrix-transform-and-other-transform-css-properties">this answer</a> css transform matrix values are equivalent to the rotate, skew and scale functions, however <a href="https://dev.opera.com/articles/understanding-the-css-transforms-matrix/" rel="noreferrer">this post</a> makes it seem much more complex...</p>
  <h2>matrix(a, b, c, d, e, f)</h2>
  <ul>
  <li><p>arguments <b>a and d</b> are for scaling the element. Identical to that of the <b>scale(a, d)</b> method.</p>
  </li>
  <li><p>arguments <b>b and c</b> are for skewing the element. Identical to that of the <b>skew(b, c)</b> method.</p>
  </li>
  <li><p>arguments <b>e and f</b> are for translating the element. Identical to that of the <b>translate(e, f)</b> method.</p>
  </li>
  </ul>
  <p>Is the transform matrix actually that simple?</p>
  <p>So the following 2 transforms would be identical</p>
  <pre><code>.scale-in {
    transform: scale(3,3) translate(200px, 200px);  
  }
  .scale-in-matrix {
    transform: matrix(3, 0, 0, 3, 200, 200); 
  }
  </code></pre>