@keyframes type {
from { width: 0; }
to { width: 100%; }
}
@keyframes blink {
50% { border-color: transparent; }
}
.typewriter-container {
color: white;
font-family: monospace;
font-size: 1.2rem;
text-align: center;
margin-top: 30px;
white-space: nowrap;
overflow: hidden;
border-right: 2px solid white;
display: inline-block;
}
.line {
display: block;
width: 0;
overflow: hidden;
white-space: nowrap;
border-right: 2px solid white;
animation: type 2s steps(30, end) forwards, blink 0.75s step-end infinite;
}
.line-2 {
animation-delay: 2.2s;
color: purple;
}
.line-3 {
animation-delay: 4.5s;
color: purple;
}
.line-4 {
animation-delay: 6.8s;
color: red;
}
<Welcome to EN1ARCHIVE />
<Collection Name: “Show Off”>
<Status: Coming Soon />
<Collection Name: “Show Off”>
<Status: Coming Soon />
EN1ARCHIVE 