# How do I animate elements in the Superwall editor?

Context [#context]

When designing paywalls in Superwall, you might want buttons, text, banners, or product cards to move, fade, or pulse. There are a few supported ways to do this, depending on whether you need simple tap feedback, a transition between two states, or a longer decorative animation.

Answer [#answer]

No. CSS `@keyframes` blocks are not currently supported in the paywall editor's Custom CSS fields.

The **Custom CSS** panel in the element properties sidebar only accepts individual CSS properties for the selected element. It is not a full stylesheet editor, so an `@keyframes` block will not work there.

Use the lightest option that fits the effect:

1. Use the tap behavior **Animation** dropdown for basic press feedback like shrink, grow, or fade.
2. Use **Effects** when an element should smoothly transition between two values, such as fading in after a state variable changes.
3. Use Lottie, GIFs, or video for longer decorative animations or detailed motion graphics.

If you paste `@keyframes` into a Custom CSS field, the animation may be ignored and should not be treated as supported behavior.

Related docs [#related-docs]

* [Custom CSS](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-styling-elements#custom-css)
* [Tap behavior animations](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-styling-elements#animation)
* [Effects](/docs/dashboard/dashboard-creating-paywalls/paywall-editor-styling-elements#effects)