#DEMO

Image Comparison Slider

Introducing the Image comparison slider module.

Image Source:Freepik

Image Compare Slider

pier-8091934_640 waterfall-8350178_640

Configuration Options

 

Below is a list of all the customization options available for the Image and Review Carousel Module

Content:

  • Title
  • Review Image Group
  • Description
  • Profile Name
  • Company Name
  • Profile Icon
  • Profile Text
  • Navigation Icons

Style:

  • Font color
  • Border
  • Active
  • Spacing
  • Padding
  • Background Colors

 

Compare Images Without Slider line and Button

 

"Click the checkbox to show or hide the slider line and button, allowing you to control the visibility of these elements on the image comparison slider."

pier-8091934_640 waterfall-8350178_640
Easy Customization for Seamless Image Comparisons
pier-8091934_640 waterfall-8350178_640

Customize the Slider line and Button Styles

 

"Customize the appearance of the image comparison slider by adjusting the background color, border style, and radius of both the slider line and button to match your desired design and branding."

 

 

Customize the image Grayscale effect

 

"Adjust the grayscale level of the image background to create the perfect contrast, allowing you to fine-tune the visual effect and highlight the comparison more effectively."

 

waterfall-8350178_640 waterfall-8350178_640

Overview

The Image Comparison Slider Module for HubSpot is a custom module designed to allow users to visually compare two images (such as "before" and "after" images) by sliding a comparison slider back and forth. This type of module is especially useful in scenarios like product transformations, image galleries, or before-and-after visuals, where users can interactively explore differences between two images. The module enables an intuitive user experience, often used in marketing or design-related websites.

Image Comparison Slider for HubSpot | Live Demo