<h1 id="element"></h1>
* {
  font-family: 'Yanone Kaffeesatz', sans-serif;
  font-weight: 300;
}

em {
  font-weight: bold;
}

body {     
  height: 100vh;
  margin: 0;
  padding: 50px;
  background: linear-gradient(45deg, rgba(gray, .01), rgba(gray, .15));
}

h1 {
  font-size: 40px;
  margin: 0;
}

a {
  position: fixed;
  bottom: 25px;
  font-size: 16px;
  font-weight: bold;
  color: darken(salmon, 25%);
  text-decoration: none;
  font-weight: 100;
  font-family: Verdana, Geneva, sans-serif;
  
  &:hover {
    color: darken(salmon, 40%);
  }
}
View Compiled
//-- Forked from https://codepen.io/alexmacarthur/pen/MOPQvp

new TypeIt('#element', {
  speed: 45
})
.type('The latest Release radar')
.pause(300)
.options({speed: 200})
.delete(5)
.options({speed: 45})
.pause(300)
.type('Radar has all sort of cool stuff')
.pause(500)
.options({speed: 200})
.delete(5)
.type('projects.')
.pause(500)
.break()
.options({speed: 45})
.type('Built by <em>people like you</em> ! 🤘🏻')
Run Pen

External CSS

  1. https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:300,400

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/typeit/5.0.2/typeit.min.js