JSFiddle - React, Tailwind, and code Playground
by CBroe
HTML
<div><span style="margin-right: -.15em;">G</span><n style="margin-right: -.25em;">3</n><span style="margin-right: -.025em;">T</span><span style="margin-right: -.15em;">R</span><n style="margin-right: -.175em;">3</n><n style="margin-right: -.1em;">4</n><span style="margin-right: -.025em;">D</span><span style="margin-right: -.175em;">Y</span><n style="margin-right: -.075em;">2</n><span style="margin-right: -.1em;">R</span><n style="margin-right: -.125em;">1</n><n style="margin-right: -.2em;">0</n><span>T</span></div>
CSS
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body,
ul {
display: flex;
justify-content: center;
align-items: center;
font-family: 'Share Tech Mono';
}
html,
body {
flex-direction: column;
min-height: 100vh;
color: #ccc;
background: #111;
}
div {
font-size: 10vw;
line-height: 1;
}
span { display: inline-block; }
n {
display: inline-block;
transform: scale(.75, .3);
color: #222;
}
@font-face {
font-family: 'Share Tech Mono';
font-style: normal;
font-weight: 400;
src: local('Share Tech Mono'), local('ShareTechMono-Regular'), url(https://fonts.gstatic.com/s/sharetechmono/v8/J7aHnp1uDWRBEqV98dVQztYldFcLowEF.woff2) format('woff2');
}