A Pen by Domas Makšimas.

index.html

<button class='push-button'>push it</button>

style.css

@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300italic);

@keyframes effect {
  0% {
    box-shadow: 0 0 0 0px #fff,
              0 0 0 5px rgba(35, 124, 234, 0.5);
  }
}

.push-button {
  font-family: 'Open Sans Condensed', sans-serif;
  font-style: italic;
  font-weight: 300;
  display: block;
  font-size: 30px;
  width: 5em;
  height: 5em;
  border: none;
  background: #0ca2cc;
  color: #fff;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  margin: 150px auto 0;
  box-shadow: 0 0 0 25px #fff,
              0 0 0 30px rgba(35, 124, 234, 0);
}
.push-button:not(:active) {
  animation: effect 0.5s;
}
.push-button:focus {
  outline: none;
}

vJgyf.markdown

vJgyf

A Pen by Domas Makšimas on CodePen.

License.