JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>

CSS

.block {
    width: 100px; 
    height: 100px;
    background-color: red;
    float: left;
    margin: 20px;
}

.block:nth-child(1) {
    transform: rotate(145deg);
}
.block:nth-child(2) {
    transform: skew(145deg);
}
.block:nth-child(3) {
    transform: scale(0.5,0.5);
}