Interaction extension · Pro
Hover a pricing card and it leans toward the cursor in 3D, catching a soft highlight. Tilt adds this to Elementor 4 cards, images, buttons and containers, with control over angle, speed, scale, perspective and glare.
On classic (v3) layouts, Elementor Pro's 3D Tilt motion effect covers the basics; Tilt is the option for Elementor 4 elements.
The short answer
Tilt is an Animation Addons for Elementor extension that adds an Elementor 3D tilt hover effect: the element rotates in 3D toward the cursor while hovered and can show a light glare. You set the maximum tilt, speed, scale and perspective, and whether it returns flat when the cursor leaves.
| Plan | Pro |
|---|---|
| Type | Interaction (hover) |
| Works on | Elementor 4 Heading, Paragraph, Button, Image, SVG, Flexbox, Div Block and Grid, plus Animation Addons atomic widgets such as Flip Box, Counter, Button Pro and Loop Grid. |
| Main controls | Enable Tilt, Max Tilt, Speed, Scale, Perspective, Enable Glare, Max Glare, Reset, Transition, Gyroscope, Enable in Editor |
| Engine | JavaScript tilt runtime in the Animation Addons Pro extension set |
| Editor preview | Enable in Editor (off by default) adds a Play button for testing on the canvas. |
| Limits | Hover needs a pointer; treat touch screens as no-tilt and use the per-breakpoint Enable Tilt. Without an active Pro licence, settings save but nothing tilts. Elementor 4.0+. |
| Plugin version | Animation Addons for Elementor 4.3 · Last updated October 2026 |
Demo variations
Every demo uses Tilt from Animation Addons Pro on Elementor 4's own elements. The settings on each card are a good place to start.
Three pricing cards; the hovered one tilts gently, grows slightly and shows a soft highlight.
A masonry-style grid of project images; each image tilts strongly toward the cursor with no glare, for a physical "photo print" feel.
A credit-card-style design that leans toward the cursor with a strong highlight, like a real card catching the light.
Portrait cards with name and role; a subtle tilt invites a closer look without distracting.
A single large product image beside the buy button that tilts deeply, like turning the box in your hands.
A large primary button that tips slightly toward the cursor, making the main action feel tactile.
Features
Every point below is a real control in the Tilt panel section or part of how it works. Nothing here needs custom code.
Max Tilt sets the largest tilt toward the cursor (15 by default). Low values feel subtle; high values feel playful.
Speed sets how quickly the tilt responds (300 by default). Scale grows the element while hovered (1 means no change). Perspective sets the 3D depth (1000 by default); lower numbers make the 3D effect stronger.
Enable Glare draws a highlight that moves across the element as it tilts, and Max Glare sets its strength (0.5 by default).
On the Advanced tab, Reset returns the element flat when the cursor leaves and Transition smooths entry and exit; both are on by default. Gyroscope is also there, on by default.
Every value can differ per breakpoint, and Enable in Editor adds a Play button so you can test the tilt on the canvas.
Step by step
Six steps from switching it on to publishing. The bold names are the exact labels you will see on screen.
Get Animation Addons ProIn WordPress, open Animation Addon › Settings › Extensions and check that Tilt is on.
Edit the page in Elementor 4 and select the card, image, button or container to tilt.
Open the Tilt section and turn on Enable Tilt.
Set Max Tilt, Speed, Scale and Perspective; on the Style tab, turn on Enable Glare and set Max Glare if you want a highlight.
On the Advanced tab, leave Reset and Transition on for a smooth return to flat.
Turn on Enable in Editor, press Play, adjust per device, then publish.
Honest comparison
Elementor Pro has a 3D Tilt mouse effect under Motion Effects on classic (v3) widgets and containers, with Direction, Speed (0–10) and per-device switches, and it works well there. Elementor 4 elements use Interactions, whose Pro custom effect can rotate an element on a Hover trigger, but to a fixed angle, not toward wherever the cursor is.
| Need | Elementor (3D Tilt on v3 / Interactions on v4) | Animation Addons Tilt |
|---|---|---|
| Tilt toward the cursor on Elementor 4 elements | No, Pro Interactions rotate to a fixed angle on Hover | Yes |
| Tilt toward the cursor on classic v3 widgets | 3D Tilt (Elementor Pro) | Not its job; Tilt is for Elementor 4 |
| Tilt strength | 3D Tilt: Speed 0–10 | Max Tilt, Speed, Scale, Perspective |
| Glare highlight | Not offered | Enable Glare + Max Glare |
| Per-device settings | 3D Tilt: on/off per device | Every value per breakpoint |
Compared with Elementor 4.3.3 (September 2026).
Who it's for
The people who get the most out of it, and what they use it for.
Drawing attention to the recommended pricing plan.
Giving thumbnails a physical feel.
Showing off a card design.
Making a hero product feel like it is in the visitor's hands.
Adding a polished hover detail across client sites without code.
FAQ
In Elementor 4, select the card, image or container, open the Tilt section from Animation Addons and turn on Enable Tilt. Set Max Tilt, Speed, Scale and Perspective, and optionally turn on Enable Glare. The element then tilts toward the cursor on hover. Tilt is part of Animation Addons Pro.
Elementor Pro's 3D Tilt motion effect belongs to classic v3 widgets and containers. On Elementor 4 elements, Pro Interactions can rotate an element on hover, but to a fixed angle rather than toward the cursor. Animation Addons Tilt adds cursor-following 3D tilt with glare to Elementor 4 atomic elements.
Enable Tilt on the card with Animation Addons, then on the Style tab turn on Enable Glare and set Max Glare between 0 and 1; 0.5 is the default and 0.2 to 0.3 looks subtle. The glare moves across the card as it tilts, which works especially well on dark cards and card-style designs.
Phones have no hover, so plan for the card to sit flat on touch screens. Animation Addons Tilt's Enable Tilt switch is set per breakpoint, so you can switch it off at tablet and mobile, or keep a smaller Max Tilt there. Make sure the card looks complete without the effect.
Animation Addons Tilt appears on Elementor 4 Heading, Paragraph, Button, Image, SVG, Flexbox, Div Block and Grid, and on Animation Addons atomic widgets. Apply it to a card's Div Block so everything inside tilts together. It needs Elementor 4.0+ and an active Animation Addons Pro licence; without it, settings save but nothing tilts.
Tilt is a visual effect on top of your content; text, links and images stay in the HTML, so search engines and screen readers are unaffected. Keep Max Tilt modest on important content, and use Animation Addons Pro's Reduced Motion option for visitors who prefer less motion. Keyboard users still reach every link as normal.
Turn on Enable in Editor in the Animation Addons Tilt section and a Play button appears, so you can test values on the canvas. The switch is off by default. Tilt works with Elementor Free 4.0 or later and needs Animation Addons Pro, not Elementor Pro.
More answers in the FAQ · Documentation · Free vs Pro
Pairs well with
What works well with Tilt on the same page or template.
Move elements across the screen with the mouse, for layered depth.
Pair a tilting card with a "View" label at the cursor.
Reveal a floating image from a tilted card or list.
Combine a tilt with a front-and-back card.
Add tilt to a button that already has hover effects.
Tilt gives Elementor 4 cards, images and buttons a 3D lean toward the cursor, with glare and per-device values.
Working on a classic v3 page? Elementor Pro's 3D Tilt covers the basics there; Tilt is for Elementor 4 elements.
