Glitch Button

<button class="nuda-glitchbtn" data-text="EXECUTE">
  EXECUTE
</button>

.nuda-glitchbtn {
  position: relative;
  padding: 10px 22px;
  background: #0c0c10;
  color: #e4ff54;
  border: 1px solid #e4ff54;
  border-radius: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.nuda-glitchbtn::before,
.nuda-glitchbtn::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  mix-blend-mode: screen;
  opacity: 0;
  pointer-events: none;
}

.nuda-glitchbtn::before {
  color: #ff5e7a;
  clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%);
}

.nuda-glitchbtn::after {
  color: #62b6ff;
  clip-path: polygon(0 55%, 100% 55%, 100% 100%, 0 100%);
}

.nuda-glitchbtn:hover::before {
  opacity: 1;
  animation: nuda-glitch-pos 0.4s steps(2) infinite;
}

.nuda-glitchbtn:hover::after {
  opacity: 1;
  animation: nuda-glitch-neg 0.4s steps(2) infinite;
}

@keyframes nuda-glitch-pos {
  0%   { transform: translate(0); }
  25%  { transform: translate(-2px, 1px); }
  75%  { transform: translate(2px, -1px); }
  100% { transform: translate(0); }
}

@keyframes nuda-glitch-neg {
  0%   { transform: translate(0); }
  25%  { transform: translate(2px, -1px); }
  75%  { transform: translate(-2px, 1px); }
  100% { transform: translate(0); }
}