CSS Pulse Animation Generator

A pulse animation draws attention to one element: a notification dot, a live indicator or a call-to-action button. Pick an effect, tune it, and copy the CSS. Add the pulse class to your element.

The generated code includes a prefers-reduced-motion rule, so the animation turns off for people who disabled animations in their OS settings. Want to see how it works? Read the CSS pulse animation guide.

More generators: CSS Gradient, CSS Buttons, Border Radius and Glassmorphism.