chromium/third_party/blink/web_tests/transforms/diamond.html

<head>
<style>
div {
  width:100px;
  height:100px;
  background-color:skyblue;
  float:left;
  border: 5px solid black;
  margin:5px;
}

.rotated {
  transform: rotate(45deg);
}
</style>
<p>You should see three blocks below.  The middle one should look like a diamond because it has been rotated 45 degrees.</p>

<div></div>

<div class="rotated"></div>

<div></div>