<div id="text"></div>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
#text {
position: relative;
color: #333;
font-size: 50px;
font-family: "Courier New", Courier, monospace;
letter-spacing: 5px;
text-shadow: 2px 2px rgba(0,0,0,0.1);
}
var text = document.getElementById('text');
var typewriter = new Typewriter(text, {
loop: true
});
typewriter.typeString('Hello!')
.pauseFor(2500)
.deleteAll()
.typeString('How are you today?')
.pauseFor(2500)
.deleteAll()
.typeString('Have a nice day :)')
.pauseFor(2500)
.start();
This Pen doesn't use any external CSS resources.