JSFiddle - React, Tailwind, and code Playground

HTML

<section>
    <div>Ich bin ein harmloser Text, der geglättet sein sollte.</div>
    <div class="opacity">Ich bin ein harmloser Text, der geglättet sein sollte.</div>
    <div class="invers">Ich bin ein harmloser Text, der geglättet sein sollte.</div>
    <div class="invers opacity">Ich bin ein harmloser Text, der geglättet sein sollte.</div>
</section>

CSS

div {

    color: #222;
    padding: 20px;
    margin: 0 20px;
    cursor: pointer;
}
div.invers {
    color: #eee;
    background: #222;
}
div:hover,
div.opacity {
    opacity: 0.999;
}

section {
 -webkit-transform: rotate(5deg);
    -webkit-transition: all 1s ease-out;
}

section:hover {
   -webkit-transform: rotate(0);