Enhance your website instantly

11 examples to customize this gorgeous lightbox script for your site


Example trainer enlarger

Multiple product images

Create a lightbox gallery with thumbnails to showcase the different colours, features and angles. Magic Thumb switches instantly between thumbnails on click or hover.


Magic Thumb - Examples

Magic Thumb - Examples Magic Thumb - Examples Magic Thumb - Examples Magic Thumb - Examples Magic Thumb - Examples Magic Thumb - Examples

Expand thumbnails

Instead of swapping thumbnails with main image, save time and open the large image directly from the thumbnail into a responsive lightbox.


Example trainer with caption on enlarged image

Lightbox caption to the right

Add value to each image with a caption. An easy and effective way to communicate important details to your visitors.



Gallery lightbox combined with carousel

Scrolling thumbnails is a popular feature when you have lots of images. Magic Thumb works seamlessly with Magic Scroll - a responsive image carousel which neatly contains all your images.






Lightbox gallery combined with 360 spin

Want to increase conversions & reduce returns? Let customers see your products from every angle with Magic 360. Combined with Magic Thumb, visitors will be completely engaged.


Show videos in lightbox gallery too

Magic Thumb goes beyond images alone - show YouTube, Vimeo or any other video. Effortlessly switch between images and videos - it's so easy.


You can trigger lighboxes from text, just like this.

Slideshows can contain unlimited images. This one has 2:

Buttons can trigger lightboxes too!

Open lightbox with text or buttons

You'll be forgiven for thinking a lightbox can only be opened from an image. Magic Thumb lets you use whatever you want: image, text, button, form, menu... anything!


Show the entire image

Auto-scaling is helpful because the user sees the enlarged image without scrolling. But sometimes you might want to show the whole image in its original size, even if it's larger than the users screen.


Fetch large image on click

To save bandwidth, you can set the large image to download on click. (Normally, it downloads automatically on page load.)


Responsive imaging

Show the best image size on every screen. Your images instinctively scale to suit different devices. Try for yourself, slide the slider to emulate the image size on different devices.


Magic Thumb - Examples

Frame images with a border

Customize the colours to suit your website. It's easy to adjust the CSS for borders, text and other styles.


What is a gallery lightbox?

You've probably seen a gallery lightbox many times when browsing websites and just not realized. It's when an image or video is enlarged to fill the screen, dimming out the rest of the web page behind.

Generally, a gallery lightbox is triggered when a thumbnail is clicked or hovered. This isn't always the case, images/videos can be any size (and orientation) not just thumbnail size, but lightboxes are commonly used when space is limited on a web page.

Benefits of using a lightbox

Created using JavaScript, this gallery lightbox is responsive so content automatically fits perfectly on any screen size. The lightbox can display an image gallery; video gallery or both images & videos.

Navigational arrows allow users to move between images and videos without returning to the web page, saving visitors time.

If using touchscreen devices, visitors effortlessly swipe between images and videos.


Get Magic Thumb now...

Buy now £29