<h1>
<span>Always</span>
<span>deliver</span>
<span>quality</span>
</h1>
body {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
}
h1 {
font-family: Helvetica, Arial, sans-serif;
font-size: 70px;
font-weight: 900;
text-transform: uppercase;
position: relative;
margin-left: -350px;
margin-top: -150px;
span {
position: absolute;
&:nth-child(odd) {
transform: skew(60deg, -30deg) scaleY(0.66667);
}
&:nth-child(even) {
transform: skew(0deg, -30deg) scaleY(1.33333);
}
&:nth-child(2) {
left: 27px;
top: 52px;
}
&:nth-child(3) {
left: 54px;
top: 105px;
}
}
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.