<link href="https://fonts.googleapis.com/css?family=Poppins:600&display=swap" rel="stylesheet">

<div class="multi-button">
  <button><i class="fas fa-cut"></i> Cut</button>
  <button><i class="fas fa-copy"></i> Copy</button>
  <button><i class="fas fa-paste"></i> Paste</button>
</div>

body {
  height: 100vh;
  margin: 0;
  display: grid;
  place-items: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  background: linear-gradient(90deg, #e3ffe7 0%, #d9e7ff 100%);
}
button{
  font-size: 5vmin;
  padding: .5em 1em;
  background: #fff;
  color: #4A5568;
  border: 0px solid #A0AEC0;
  margin: .1em;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
  box-shadow: 0 0 0 #BEE3F8;
  transform: translateY(0);
}
button:first-of-type{
  border-radius: .5em 0 0 .5em;
}
button:last-of-type{
  border-radius: 0 .5em .5em 0;
}
button i{
  color: #A0AEC0;
  margin-right: .3em;
  transition: all .2s ease-out;
}
.multi-button:hover button{
  color: #A0AEC0;
}

.multi-button:hover button:hover{
  background: #D53F8C;
  color: #fff;
  box-shadow: 0 0 0.8em 0 rgba(213, 63, 140, .8);
  transform: translateY(-.2em);
}
.multi-button:hover button i{
  color: #CBD5E0;
}
.multi-button:hover button:hover i{
  color: #FED7E2;
  transform: rotate(-10deg);
}