Avada Image Before & After Element Showcase

The Avada Image Before & After Element allows you to display two images in a single frame with an interactive slider that lets users compare them by dragging horizontally or vertically. This is especially useful for showcasing transformations, such as design updates, renovations, or retouching work. You can customize the slider orientation (Horizontal/Vertical), label text, and styling to match your website's branding.

Below, you will find live examples of the Image Before & After Element in action. Examples can include the individual option values set for that display; however, in some instances, not all Element variations can be shown as they may be too numerous. For further information related to this Avada Design Element, please check the Avada help center.

Running ShoeRunning Shoe

This Image Before & After Element is set up as follows: Effect Type (Slide), Before Image Label, After Image Label, Label Font Size (13px), Label Placement (Image Centered), Label Hover Type (Individual), Handle Design Style (Circle With Arrows), Handle Color, Handle Background Color, Handle Offset (50%), Handle Orientation (Horizontal), Handle Movement Control (Drag & Click), and Alignment (Center).

Running ShoeRunning Shoe

This Image Before & After Element is set up as follows: Effect Type (Fade), Image Fade Transition Speed (0.5), Alignment (Center), and Border Radius (7px).

Avada Before Mockup 1Avada Before Mockup 2
Avada Before Mockup 3Avada Before Mockup 4
Avada Before Mockup 1Avada Before Mockup 4
Avada Before Mockup 2Avada Before Mockup 4
Avada Before Mockup 3Avada Before Mockup 2
Avada Before Mockup 2Avada Before Mockup 4

The image Before & After Element examples above primarily showcase the Handle Design Style and Orientation. The general setup is as follows: Effect Type (Slide), Handle Design Style, Handle Color, Handle Background Color, Handle Offset (50%), Handle Orientation (Horizontal/Vertical), Handle Movement Control (Drag & Click), and Alignment (Center).

Avada Image Element Featured ImageImage
Avada Carousal Element Featured ImageImage Carousel