Hi guys, I’m happy to introduce Parallax Image, a new component for Elements that brings smooth scroll-driven motion to any background image
.
If you build professional sites and care about how pages feel, this one belongs in your toolkit. A moving background image changes everything, it adds depth, life, and that extra touch that makes a page memorable. Scandalous that nothing like this existed yet for Elements. That’s exactly why I built it.
You can use it in the classic way, using just the image or with text in the center, or you can apply an overlay. But if you want to go further, this component offers very creative options, and these demos show some examples.
Features
It goes beyond a simple parallax effect. Four overlay styles, 16 blend modes, dark mode support, dropzone for content on top, and full integration with the Elements theme system. Works inside columns and grids, multiple instances on the same page, smooth on mobile out of the box.

Load your image from any source

A special OVERLAY with blending effects

This component offers an equally smooth experience on mobile devices. But if you don’t want to use swear words on mobile, just disable the option and the component will intelligently do so only on actual mobile devices, not just by measuring the width like Elements does.
Key features:
- Parallax scroll with adjustable speed, easing curves and automatic bleed
- Four overlay styles: solid color, gradient, shading and image
- 16 blend modes for creative compositing
- Dark mode support for background and overlay
- Multiple image loading options with light and dark variants
- Dropzone with max width and padding control
- Box shadow and border controls
- Mobile parallax tested on real devices
- Custom CSS classes for advanced control
A demo project is included with ready-to-use layouts, from clean hero sections to complex layered compositions. Replace the images and the result is yours.
Parallax Image is available in the marketplace!
Now in promo! ![]()
Happy to hear your feedback, thanks ![]()

