Snippet / Theme Options > Custom CSS and Button module CSS class

Button Shake Attention Grabber

A short shake animation class for Divi buttons with a built-in pause and reduced-motion fallback.

Add dfy-shake to one button only. This is for narrow campaigns, limited-time offers, or a single high-priority action.

.et_pb_button.dfy-shake {
  animation: dfy-shake-button 4s ease-in-out infinite;
}

.et_pb_button.dfy-shake:hover,
.et_pb_button.dfy-shake:focus-visible {
  animation: none;
}

@keyframes dfy-shake-button {
  0%,
  88%,
  100% {
    transform: translateX(0);
  }
  90% {
    transform: translateX(-4px);
  }
  92% {
    transform: translateX(4px);
  }
  94% {
    transform: translateX(-3px);
  }
  96% {
    transform: translateX(3px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .et_pb_button.dfy-shake {
    animation: none;
  }
}

Notes

• Do not combine this with other button animations.
• Disable on sticky headers or crowded hero areas where motion can feel noisy.

Sources

• https://divilover.com/css-code-snippets-for-divi-buttons/