3D Cube

/*Downloaded from https://www.codeseek.co/oieduardorabelo/3d-cube-kqpGH */
  html, body {
    height: 100%;
  }

  .stage {
    position: relative;
    min-height: 100%;
    width: 100%;
    -webkit-perspective: 1200;

    display: -webkit-flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
  }

  .cube {
    /*position: absolute;*/
    height: 200px;
    width: 200px;

    -webkit-transform-style: preserve-3d;
  }

  .cube.n1 {
    left: 120px;
    -webkit-transform: rotate3d(-1, 1, 1, -22deg);
  }

  .cube.n2 {
    left: 360px;
    -webkit-transform: rotate3d(-10, 5, 4, 71deg);
  }

  .cube.n3 {
    left: 600px;
    -webkit-transform: rotate3d(1, 2, 0, 180deg);
  }

  .face {
    position: absolute;
    width: inherit;
    height: inherit;
    opacity: .5;
  }

  .face.front {
    background-color: blue;
    -webkit-transform: translateZ(100px);
  }

  .face.left {
    background-color: green;
    -webkit-transform: translateX(100px) rotateY(90deg);
  }

  .face.right {
    background-color: orange;
    -webkit-transform: translateX(-100px) rotateY(-90deg);
  }

  .face.back {
    background-color: purple;
    -webkit-transform: translateZ(-100px) rotateY(180deg);
  }