<div class="content">
  <a href="#" class="arrow-draw-link-1">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    You can hover
  </a>
</div>

@import url(https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed:9000);

body {
  background-color: #222;
  font: 1.2em Calibri, Arial, sans-serif;
}

.content {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: 2rem;
  margin: 4rem 0;
}

/*
 * arrow-draw-link-1
 */
$color: #fff;
a.arrow-draw-link-1 {
  display: inline-block;
  position: relative;
  padding: 12px 18px 12px 24px;
  color: $color;
  font-family: "Barlow Semi Condensed", Arial, sans-serif;
  font-size: 3.6rem;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;

  > span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 0.5em;
    border: 2px solid $color;
    transition: clip-path 250ms linear;
  }

  > span:nth-child(1) {
    clip-path: polygon(50% 50%, 0 40%, 0 40%);
    transition-delay: 1000ms;
  }

  > span:nth-child(2) {
    clip-path: polygon(50% 50%, 0 0, 0 0);
    transition-delay: 750ms;
  }

  > span:nth-child(3) {
    clip-path: polygon(50% 50%, 100% 0, 100% 0);
    transition-delay: 500ms;
  }

  > span:nth-child(4) {
    clip-path: polygon(50% 50%, 100% 100%, 100% 100%);
    transition-delay: 250ms;
  }

  > span:nth-child(5) {
    clip-path: polygon(50% 50%, 0% 100%, 0% 100%);
    transition-delay: 0ms;
  }

  &:hover {
    > span:nth-child(1) {
      clip-path: polygon(50% 50%, 0 40%, 0 0);
      transition-delay: 0ms;
    }

    > span:nth-child(2) {
      clip-path: polygon(50% 50%, 0 0, 100% 0);
      transition-delay: 250ms;
    }

    > span:nth-child(3) {
      clip-path: polygon(50% 50%, 100% 0, 100% 100%);
      transition-delay: 500ms;
    }

    > span:nth-child(4) {
      clip-path: polygon(50% 50%, 100% 100%, 0% 100%);
      transition-delay: 750ms;
    }

    > span:nth-child(5) {
      clip-path: polygon(50% 50%, 0% 100%, 0% 60%);
      transition-delay: 1000ms;
    }
  }
}