BLACK FRIDAY: 50% OFF all Pro plans
Pro from $18 a year or $60 lifetime, no code needed
Ends Cyber Monday, 30 Nov. Lock in the price today
Get 50% Off
Pro widget

Tilt Card Widget for Elementor Pro

An image card that leans towards the pointer in 3D.

Overview

What Tilt Card does

Tilt Card is an image card that leans towards the pointer in 3D, with a moving light reflection and text that floats above the image. It holds a badge, title, text and a button, and the whole card can be a link. Use it for featured products, portfolio pieces and calls to action.

Live demo

See it in action

Tilt card

Move the pointer over the card to see it lean. Learn more
Features

What it can do

  • The card tilts in 3D as the pointer moves over it.

  • A light reflection follows the pointer across the card.

  • Badge, title, text and button float above the image.

  • The card can grow slightly and the image can zoom on hover.

  • Can lean towards the pointer or away from it.

  • The whole card can be the link.

  • Text at the top, middle or bottom, aligned left, center or right.

  • Image shade that fades out towards the top, is even, or is off.

Use cases

When to use it

Featured product

Put a product photo in the card with a badge such as New and a button to the product page.

Portfolio tiles

Place several cards in a row and make each whole card a link to its project.

Call to action

Use a short title, one line of text and a button over a strong image.

Setup

How to set it up

A few steps from adding the widget to a finished result.

  1. Drag Tilt Card onto the page and choose the Image.

  2. Type the Badge, Title and Text.

  3. Set the Button Text and Button Link, and switch on Whole Card Is the Link if the card itself should be clickable.

  4. Choose the Text Position and Text Alignment.

  5. In Tilt Effect, set Strongest Tilt (degrees), Depth (px), Grow on Hover (percent) and Text Floats Above the Image (px).

  6. Switch Light Reflection and Zoom Image on Hover on or off.

  7. Set the card height, shade and text styles in the Style tab.

FAQ

Questions and answers

Does the tilt work on phones?

No. The tilt reacts to a mouse or pen pointer. On touch screens the card shows as a normal image card with its text.

Can the whole card be clickable?

Yes. Add an address in Button Link and switch on Whole Card Is the Link.

How do I make the effect more subtle?

Lower Strongest Tilt (degrees), raise Depth (px), and reduce Grow on Hover (percent).

Can the light reflection be turned off?

Yes. Switch off Light Reflection. Its color can be changed with Reflection Color in the Style tab.

Bright Addons Pro

Get Tilt Card with Bright Addons Pro

Bright Addons Pro has 80 Pro widgets plus all 51 free widgets, 10 extensions, a Theme Builder and 32 dynamic tags. From $18 a year, with a 14-day money-back guarantee.