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

Tilt Card

Pro

An image card that leans towards the pointer in 3D, with a light reflection and floating text. It comes with Bright Addons Blocks Pro, which also includes every free block.

Live demo

See the Tilt Card block

This is the block itself with its starting settings. Change any of them in the block sidebar.

New

Design that moves

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

What you can set

Everything is in the block sidebar

The Tilt Card block has 4 settings panels. No code needed.

  • Card

    Set image, Badge, Title, Title tag, Text, Button text, Link, Button icon, Icon position and 4 more settings.

  • Tilt effect

    Set strongest tilt (degrees), Depth (px), Grow on hover (%), Text floats above the image (px), Light reflection, Lean away from the pointer and Zoom the image on hover.

  • Size and shade

    Set height (px), Widest (px, 0 = full width), Corner radius (px) and Image shade.

  • Colors

    Set 8 color settings.

How to use it

Add it in four steps

  1. Install the plugin

    Install Bright Addons Blocks Pro from your account and activate your licence. It includes every free block.
  2. Add the block

    Open a page or post in the block editor, press +, and search for “Tilt Card”. It is in the Bright Addons Pro category.
  3. Set it up

    Open the block sidebar and work through Card, Tilt effect, Size and shade and Colors.
  4. Publish

    Preview the page on desktop, tablet and phone, then publish. The block loads its own CSS and JavaScript only on pages that use it.

Settings

The main settings

The full list, panel by panel, is in the Tilt Card guide.

Setting What it does Choices
Image (Card) Image from the Media Library. –
Badge (Card) Text you type. –
Title (Card) Text you type. –
Title tag (Card) Choose one. H1, H2, H3, H4, H5, H6, div, p
Text (Card) Text you type. –
Button text (Card) Leave empty to hide the button. –
Link (Card) Link address. –
Button icon (Card) Icon picker. –
Icon position (Card) Choose one. Before, After
The whole card is the link (Card) On or off. –
Open the link in a new tab (Card) On or off. –
Text position (Card) Choose one. Top, Middle, Bottom
Text alignment (Card) Choose one. Left, Center, Right
Strongest tilt (degrees) (Tilt effect) From 0 to 35. –

Questions

Good to know

Is the Tilt Card block free?

Tilt Card is a Pro block. It comes with Bright Addons Blocks Pro, which has the same plans and prices as Bright Addons Pro for Elementor and includes all 62 free blocks.

Do I need Elementor for this block?

No. It is a block for the WordPress block editor (Gutenberg). Elementor is not needed. If you use Bright Addons Pro for Elementor on the same site, both plugins work side by side.

Will it slow down my pages?

No. Each block loads only its own small CSS and JavaScript, and only on pages where it is used. Blocks you do not need can be switched off in Bright Blocks.

Does it work with my theme?

Yes. The blocks work with block themes and classic themes, and follow your theme fonts. Wide and full width alignment are supported.

Bright Addons Blocks

Get every block in one plugin

Blocks Pro has all 99 Pro blocks, the 62 free blocks, Pro effects for every block, Theme Templates and popups.