Adding a Card Slider

A carousel-style layout of cards is effective for concisely presenting a collection of items

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

Similar to carousels, 'card sliders' are a great way to showcase images and copy together on an 'information card'. Complete with a CTA (call to action) button you can get creative with displaying services, product categories, or even recipes like we've demonstrated in the preview below... Delicious.

Adding a Card Slider in Vev

๐Ÿ‘๐Ÿฝ Adding a card slider

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

  • Search for and select 'Card Slider'

  • Click and drag the element onto your canvas

Uploading an Image

  • Double-click the Cardslider

  • In the Icon field, click the pen

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

Adding a New Card

  • Double-click the Card Slider

  • Click the + button at the bottom of the pop-up

Navigate through the cards to customize the text and images.

๐ŸŽจ Styling a card slider

  • Background:

    • IM: Change the Image Banner background

    • TE: Change the Text Container background

    • Link: Change the link background

  • Text:

    • Title: Style the title

    • Subtitle: Style the subtitle

    • Body: Style the body text

    • Link: Style the bottom link

    • BO: Style the bottom link on hover

    • Navigation Arrows: Change the arrow's color (If enabled)

  • Margin: Add margin to the body and link

  • Padding: Add padding to both the text container and link

  • Border: Set a border color, opacity, and line weight for the card, link, and bottom link

  • Border Radius: Curve the radius of the border of the card and link

  • Effects: Add different types of shadows or blur effects to the card and link. Learn more about effects

  • Transform: Change the image banner height

  • Icons:

    • Set custom shape: Replace the default icon with a shape or a custom SVG.

    • Set custom image: Replace the default icon with an image.

โš™๏ธ Configuration options

Once you've added the Card slider to your canvas, there are a variety of configuration options, including titles, sub-titles and CTA actions.
To start, double-click the Card slider to open the configuration options.

Card Slider configuration Options




Image for the card item

Custom image size

Sets the height of the image to a custom value. Width is automatically scaled to maintain the image aspect ratio.


The top-most text in the text group.


The second line of text in the text group.


The third text element in the text group.

Link label

The UI text for the link button.


The destination where the user will be directed upon clicking the link.

Horizontal image alignment

The left-to-right alignment of the image.

Hide arrows

Show or hide the left/right arrows which can be used for navigating through the card slider.

Did this answer your question?