---
title: "Divi Card"
url: "https://divipeople.com/docs/divi-card-module-doc.md"
canonical: "https://divipeople.com/docs/divi-card-module-doc/"
published: "2026-07-13"
modified: "2026-07-13"
author: "Fahim Reza"
tags:
  - "divi-conkit-pro"
---

# Divi Card

**Card** is part of **Divi Conkit Pro**. It combines an image, heading, body text, an optional badge, and a CTA button into a single styled card — the building block for services, pricing blurbs, and feature grids.

## Key Features

- **Flexible image/icon position** — Top, Left, or Right of the content.
- **Hover overlay** — an optional icon overlay that fades in on hover, with adjustable speed and opacity.
- **Corner badge** — position it in any of 4 corners with custom offset and padding.
- **5 hover animations** for the image — Zoom In, Zoom Out, Slide Up, Slide Down, Shrink, or Greyscale.

## Adding the Module

1. Edit a page with the Divi Visual Builder.
2. Add a new module and search for **Card**.
3. Upload an image, add your title/description, then enable Use Badge or Use Button as needed.

## Content Settings

- **Image/Icon Position** — Top, Left, or Right.
- **Use Badge** — Badge Position (4 corners), Horizontal/Vertical Offset, Padding.
- **Use Button** — Button Link, open in new window.
- **Show Overlay on Hover** — Overlay Hover Speed, Background, Icon, Icon Color/Size/Opacity.
- **Content Overflow** — Hidden or Visible, plus Content Padding and Alignment.

## Design Settings

- **Image** — Height, Width, Padding, and Hover Animation.
- **Content** — title/description typography and content box padding.
- **Badge** — background, color, and padding when Use Badge is on.
- **Button** — full button styling including hover state.

> **Consistent card grids**
> Set the same Image Height across every Card instance in a row so cards line up evenly even when titles or descriptions vary in length.

## FAQ

### Does it work with Divi 5?

Yes. Native Divi 5 module with full Divi 4 support — your license covers both.

### Can Cards slide in a carousel?

For a swipeable row of cards, use Divi Carousel Pro’s Card Carousel module instead — it wraps this same card style in a Swiper.js carousel.

### Where can I see it in action?

Visit the [Card module page](https://divipeople.com/modules/card/) for a live overview and pricing.