<div class="button">
  <div class="button__inner"><i class="fa fa-arrow-left" aria-hidden="true"></i></div>
</div>

<div class="slide">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Maxime, asperiores eligendi possimus aliquam culpa inventore nemo magnam consectetur soluta fugit tempore voluptate fuga alias necessitatibus, voluptas ullam minima velit? Odit!</div>

body {
  margin: 50px;
  background-color: #f1f1f7;
}

.button {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.button::before,
.button::after {
  content: '';
  position: absolute;
  width: 70%;
  height: 70%;
  border-radius: 50%;
  background-color: #fff;
  z-index: -2;
}

.button::before {
  left: -10px;
}

.button::after {
  right: -10px;
}

.button:hover .button__inner {
  color: rgb(114, 114, 255, 1);
}

.button:hover .button__inner::before {
  box-shadow: 0 0 30px 0px rgb(114, 114, 255, 1);
}

.button__inner {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  color: #eee;
  border-radius: 50%;
  background:
    radial-gradient(circle at -10px 50%, transparent 15px, #fff 16px) no-repeat 0 0 / 50% 100%,
    radial-gradient(circle at calc(100% + 10px) 50%, transparent 15px, #fff 16px) no-repeat 100% 0 / 50% 100%;
  transition: color 350ms;
}

.button__inner::before {
  content: '';
  position: absolute;
  width: 75%;
  height: 75%;
  border-radius: 50%;
  box-shadow: 0 0 20px 0px rgb(114, 114, 255, 0.5);
  transition: box-shadow 350ms;
  z-index: -1;
}

.slide {
  position: relative;
  display: inline-flex;
  width: 50%;
  margin-left: 50px;
  border-radius: 25px;
  padding: 15px;
  background:
    radial-gradient(circle at -10px 50%, transparent 15px, #fff 16px) no-repeat 0 0 / 50% 100%,
    radial-gradient(circle at calc(100% + 10px) 50%, transparent 15px, #fff 16px) no-repeat 100% 0 / 50% 100%;
}

.slide::after {
  content: '';
  position: absolute;
  top: 25px;
  left: -25px;
  width: calc(100% + 50px);
  height: calc(100% - 50px);
  border-radius: 25px;
  background-color: #fff;
  z-index: -2;
}

.slide::before {
  content: '';
  position: absolute;
  top: 15px;
  left: 15px;
  width: calc(100% - 30px);
  height: calc(100% - 30px);
  border-radius: 25px;
  background-color: #fff;
  z-index: -1;
  box-shadow: 0 0 30px 0px rgb(114, 114, 255, 0.5);
}