Border Trace Hover

<div class="trace-card">
  <span style="font-weight:600;font-size:14px">Hover me</span>
</div>

.trace-card {
  position: relative;
  width: 180px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.trace-card::before,
.trace-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 1.5px solid #1a1a1a;
  border-radius: 10px;
}
.trace-card::before {
  clip-path: inset(0 100% 0 0);
  transition: clip-path .4s cubic-bezier(.4,0,.2,1);
}
.trace-card::after {
  clip-path: inset(0 0 0 100%);
  transition: clip-path .4s cubic-bezier(.4,0,.2,1) .1s;
}
.trace-card:hover::before {
  clip-path: inset(0 0 0 0);
}
.trace-card:hover::after {
  clip-path: inset(0 0 0 0);
}