<a href="#" class="btn">
  <span>Button</span>  
  <svg
       class="btn-line"
       viewBox="0 0 160 60" 
       xmlns="http://www.w3.org/2000/svg"
       preserveAspectRatio="none">
    <rect />
  </svg>  
</a>
* {
  box-sizing: border-box;
}

.btn {
  text-decoration: none;
  font-size: 16px;
  line-height: 1;
  font-family: sans-serif;
  
  display: inline-flex;
  align-items: center;
  justify-content: center;
  
  background: #000;
  color: #fff;
  
  height: 50px;
  border-radius: 25px;
  padding: 10px 30px;
  position: relative;
  
  margin: 20px;
  min-width: 150px;
}

.btn-line {
  position: absolute;
  top: -5px;
  left: -5px;
  width: calc(100% + 10px);
  height: calc(100% + 10px);
}

.btn-line rect {
  fill: none;
  stroke: #000;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  rx: calc(30px);
  x: .5;
  y: .5;
  
  stroke-dasharray: 100;
  animation: dash 5s linear infinite;
}

@keyframes dash {
  to {
    stroke-dashoffset: 1000;
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.