Modern CSS Animation Effects

Select Actions category.

Text Section

Select Text Effect:

Action Code:

/* Fade In Effect Example for text:
   "Your sample text here"
*/
@keyframes textFade {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
.effect-text-fade { animation: textFade 1s ease-in-out; }

Button Section

Select Button Effect:

Animation Code:

/* Bounce Effect Example */
@keyframes buttonBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.effect-button-bounce { animation: buttonBounce 1s ease-out infinite; }

Image Section

Select Image Effect:

Animation Code:

/* Zoom Effect Example */
@keyframes imageZoom {
  0% { transform: scale(1); }
  100% { transform: scale(1.2); }
}
.effect-image-zoom { animation: imageZoom 0.5s forwards; }