html trasformed page background code example

Example 1: css rotate

<style>
div {
  width: 80px;
  height: 80px;
  background-color: skyblue;
}
.rotated {
  transform: rotate(45deg);
  background-color: pink;
}
</style>

/* In body of html doc */
<div>Normal</div>
<div class="rotated">Rotated</div>

Example 2: rotate background image css

.theWholeElement{
  transform: rotate(30deg);
}

.justTheBackground{
  position: relative;
  overflow: hidden;
}

.justTheBackground::before{
  content: "";
  position: absolute;
  width: 200%;
  height: 200%;
  top: -50%;
  left: -50%;
  z-index: -1;
  background: url(background.png) 0 0 repeat;
  transform: rotate(30deg);
}