Skip to content

Instantly share code, notes, and snippets.

Created March 22, 2016 12:48
Show Gist options
  • Save anonymous/ae8ea827917751a09acb to your computer and use it in GitHub Desktop.
Save anonymous/ae8ea827917751a09acb to your computer and use it in GitHub Desktop.
typing effect CSS
<p>hi folks, this is typing animation using CSS
<span>|</span></p>
body{
background: #000;
padding-top: 10px;
}
p{
color: lime;
font-family: "Courier";
font-size: 20px;
/* margin: 10px 0 0 10px;*/
white-space: nowrap;
overflow: hidden;
width: 30em;
animation: type 1s steps(60, end);
}
span{
animation: blink 1s infinite;
}
@keyframes type{
from { width: 0; }
}
@keyframes blink{
to{opacity: .0;}
}
@karanbhandari
Copy link

typing effect totally using css

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment