body {
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.box, .box1 {
  position: absolute;
  width: 100px;
  height: 100px;
  background-color: #00aa9d;
  display: flex;
  justify-content: center;
  align-items: center;
}

.box1 {
  background-color: #2b3f53;
  transition: transform 1s;
}

.box1:hover {
  transform: skew(20deg, 20deg);
}

.box1 span {
  background-color: yellow;
}