Using the Image Card element

A pre-designed card with navigation controls to flip through multiple cards

Diego Muralles avatar
Written by Diego Muralles
Updated over a week ago

The Image Card element is one of many ways to display a sliding card full of information and image assets with minimal effort.

Image card in Vev

Adding an image card

  • From the top menu bar, click on the Add Menu (Shortcut: M)

  • Search for and select Image Card

  • Click and drag the element onto your canvas

Uploading an Image

  • Double-click the Image Card

  • Click the pen icon under Image or Icon

  • Select Add image or choose an image from one of our free stock images libraries

Adding a New Card Text

  • Double-click the Image Card

  • Click the + icon located at the bottom of the settings panel

A new Image Card will be added, you can navigate through them to customize the text and icon for each of them as needed.

Styling an image card

  • Cropping:

    • Auto crop: Automatically crop the Top image based on the percentages to the left

    • Contain: Increases or decreases the size of the Top image to fill the container and preserves the aspect ratio

    • Stretch to fill: Stretches the Top image to fit the container, regardless of its aspect ratio

  • Background:

    • BO: Change the background color of the Content section (where the Title and Body text are)

  • Text:

    • TI: Style the card's Title

    • BO: Style the Body text

  • Effects: Add different types of shadows or blur effects to the element's container. Learn more about effects

  • Transform:

    • TO: Change the Top image's height

    • BO: Change the card's content section's height

Configuration options

Once you've added the Image Card to your canvas, there are a variety of configuration options, including titles, body copy and icon assets.

To start, double-click the Image Card to open the configuration options.




Image located at the top of the card


Image located between the top image and the card content


The top-most text in the text group.


The second text element in the text group.

Did this answer your question?