NewThe Supreme Bundle: every Divi Supreme plugin, 31% less than buying separately.See what’s inside →

Tilt Image module

Divi Tilt Image follows the mouse in 3D.

Tilt Image for Divi 5. Images that lean towards the cursor, with glare, a floating overlay and a lightbox.

Divi 5 launch week poster

Glare

Divi Meetup ticket

Divi Meetup

Join us in Lisbon

Parallax overlay

Divi Meetup ticket

Reverse

What is the Divi Tilt Image module?

Tilt Image is a Divi 5 module in Divi Supreme Pro that tilts an image in 3D as the mouse moves over it. Use it for product shots, portfolio thumbnails, event posters, app screenshots and team photos that should feel touchable.

Upload the image, then tune the Perspective, Max Rotation, Scale on Hover and Speed. Add a glare that follows the cursor, reverse the tilt direction, or turn on the 3D Pop Out Effect so an overlay with an icon, title and text floats above the image. Link the image, open it in a lightbox, or switch the effect off on mobile.

default max rotation

default perspective

default speed

lightbox option

Start from a Tilt Image recipe.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Try every Tilt Image setting.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Everything Tilt Image can do.

Mouse-driven tilt

The image leans towards the cursor, up to the Max Rotation you set.

Perspective and scale

Lower perspective for a stronger effect; scale up to 200% on hover.

Glare

A light reflection follows the cursor, with its own opacity.

3D Pop Out

The overlay floats 20px to 100px above the image.

Overlay content

Add an icon, Overlay Title and Overlay Content, always on or on hover.

Reverse and speed

Flip the tilt direction and set the enter and exit speed.

Link or lightbox

Send visitors to a URL or open the image in a lightbox.

Disable on Mobile

Turn the tilt off on phones and tablets with one toggle.

Tilt Image documentation

Step-by-step guide to tilt settings, glare, the 3D pop out overlay and lightbox.

Questions about Tilt Image.

How do I add a 3D tilt effect to an image in Divi?

Add the Tilt Image module and upload your image under Image. The tilt works straight away with a Max Rotation of 35, a Perspective of 1000px and a Speed of 300.

How do I make the tilt stronger or softer?

Raise Max Rotation (10 to 50) for more tilt, or lower Perspective (500px to 1500px) for a more extreme 3D look. Lower Max Rotation or raise Perspective to soften it.

How do I add the glare effect?

Turn on Use Glare. Then set Glare, the glare opacity, from 0.1 to 1 (1 by default).

What does the 3D Pop Out Effect do?

It lifts the overlay off the image so it floats in front while the image tilts. Turn on Use 3D Pop Out Effect and set Overlay 3D Pop out from 20px to 100px (30px by default).

How do I show a title or icon over the image?

Under Overlay, turn on Use Icon and pick an Icon, or fill in Overlay Title and Overlay Content. Turn on Show on Hover to reveal the overlay only when the mouse is over the image.

Can I open the image in a lightbox?

Yes. Turn on Open in Lightbox under Link. With it off, you can set an Image Link URL and choose In The Same Window or In The New Tab.

Can I turn the tilt off on phones?

Yes. Turn on Disable on Mobile under Tilt Settings and the image stays still on mobile devices.

Does the image zoom when tilting?

Only if you set Scale on Hover above 1. For example, 1.5 scales the image to 150% on hover.

Next module, A to Z

Typing Effect Module

Related modules

Perspective Image Module

Images on a 3D angle.

Image Hover Reveal Module

An image that appears on hover.

Flipbox Module

Cards that flip to show the back.

4.9 out of 5

Rated 4.9 by Divi designers on Trustpilot. Running on 350,000+ sites.

Give your images depth.

Tilt Image comes with 70+ Divi 5 modules and 16 extensions in Divi Supreme Pro.

Divi Supreme