---
title: "Divi Image Compare"
url: "https://divipeople.com/docs/divi-image-compare-doc.md"
canonical: "https://divipeople.com/docs/divi-image-compare-doc/"
published: "2026-07-13"
modified: "2026-07-13"
author: "Fahim Reza"
tags:
  - "divi-conkit-pro"
---

# Divi Image Compare

**Image Compare** is part of **Divi Conkit Pro**. It overlays two images with a draggable handle so visitors can slide between a “before” and “after” view — ideal for renovations, retouching, and product comparisons.

## Key Features

- **Draggable handle** with a customizable color.
- **Vertical or horizontal orientation.**
- **Move on Hover** — let the handle follow the cursor without clicking.
- **Labeled before/after** — optional text labels with their own background color, shown Always or On Hover.

## Adding the Module

1. Edit a page with the Divi Visual Builder.
2. Add a new module and search for **Image Compare**.
3. Upload a Before Image and an After Image, then set the Orientation and Handle Initial Offset.

## Content Settings

- **Before Image / After Image** — the two images being compared, each with an optional Label.
- **Orientation** — Vertical or Horizontal slider direction.
- **Handle Initial Offset** — starting position from 0.0 to 0.9.
- **Move on Hover / Use Overlay on Hover / Show Before/After Label** — Always or On Hover.

## Design Settings

- **Handle** — Handle Color.
- **Labels** — Before/After Label Background.
- **Box** — Padding, Height, Width.

> **Equal image dimensions**
> Use before/after images with matching dimensions and framing — mismatched crops make the slide comparison look misaligned as the handle moves.

## FAQ

### Does it work with Divi 5?

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

### Does it work on touch devices?

Yes — visitors can drag the handle with a touch gesture on mobile.

### Where can I see it in action?

Visit the [Image Compare module page](https://divipeople.com/modules/image-compare/) for a live overview and pricing.