Seventh > Sections > Image comparison

Image comparison

The Image comparison section lets you compare two images with a draggable slider. It’s ideal for before/after visuals or feature highlights.

What it does

This section displays:

  • A before/after image slider
  • Optional labels or captions
  • A responsive comparison layout

Section settings explained

Layout

Image comparison layout

  • Controls the layout and presentation of the comparison (horizontal vs vertical)

Invert layout on mobile devices

  • Allows to change the direction of the slider on mobile devices
  • Can be used to offer a horizontal style on desktop, but a vertical one on mobile (better UX)

Desktop aspect ratio

  • Adjusts how images are sized and cropped on desktop

Mobile aspect ratio

  • Adjusts how images are sized and cropped on mobile

Tip: Choose images with similar framing for the clearest comparison.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.