Skip to main content

Hover Image

The Hover Image component is built with a primary image and an alternate image. The component displays the primary image by default and instantly swaps to the alternate image when a user hovers over it with a mouse or taps a toggle button on mobile. This can be used for showing alternate product angles, revealing interactive details, or adding engaging visuals to our teasers, carousels, and standard page layouts.

This component can be used with the following Smart Crops and can be fit to your desired width on the page: 

No Crop

21:9

Caption

16:9

1:1

2:3 (with icon 'toggle' white or black on desktop)

2:3 (with icon 'swap' white or black on desktop)

472x550 (3-up style)

Back to Top