JSFiddle - React, Tailwind, and code Playground

by Kalu Singh Rao

HTML

<div>
<h1 class="hypetext" id="hypetop">DIRE</h1>
    <img id="hype" src="DIREHYPE.png" width="224" height="224"/>
<h1 class="hypetext" id="hypebot">HYPPPPPPPPPPPE</h1>
</div>

CSS

body {
margin: 0;
background-image: url("rainbowbg.png");
}
div #hype {
margin:auto;
display: block;
position: relative;
margin-top:50px;
}
#hypetop {
position: relative;
top: 0;
width: 100%;
}
#hypebot {
position:relative;
bottom: 0;
width: 100%;
}
.hypetext {
font-family: Impact, Charcoal, sans-serif;
font-size: 64px;
text-align: center;
}