A gallery lets you showcase your images, products, and any other web contents in an elegant way.
Here is a list of the 10 Best Galleries implement in Vanilla JavaScript and/or pure HTML/CSS/CSS3.
I hope you like it and don’t forget to spread the world.
Originally Published Dec 13 2017, updated July 12 2019
1. Gallerly.js
Gallerly.js is a pure JavaScript photo gallery that lets you create a thumbnail grid with an expanding large image preview as you seen on Google Image Search.
2. CSSBox
A minimal, responsive image gallery lightbox where the user is able to navigate between full sized images in a fullscreen lightbox popup. Built using CSS / CSS3 and plain html markup.
3. flexbin.css
flexbin.css is a lightweight, flexible CSS library which lets you create responsive, neat, justified grid layout for showcasing your photos as you seen on Google Image Search and Flickr. Heavily based on CSS3 flexbox and fully customizable via SCSS.
4. Pure CSS Photo Gallery with Image Lightbox Support
A pure CSS/CSS3 based responsive photo gallery for your portfolio website that has the ability to view the large image version in a lightbox.
5. Material Responsive Photo Gallery
Material Photo Gallery is a Vanilla JavaScript plugin that helps you generate a nice, responsive thumbnail grid as you seen on Google Image Search. Once you click on a thumbnail, the zoomed image will displayed in a fullscreen lightbox gallery with left / right arrows which enable you to navigate through all photos.
6. Simple Tab Gallery
A CSS only gallery that enable the user to switch between images by clicking on the tabbed thumbnail navigation. Built using CSS3 flexbox model, transitions, transforms and html radio input tricks.
7. Scattered Polaroid Gallery
A simple JavaScrpt and CSS/CSS3 based Polaroid Gallery that automatically moves the selected photo into the middle of the screen while shuffling the others. Also provides a navigation which allows you to navigate between photos with next / prev buttons.
8. Pure JavaScript Fullscreen Image Gallery With Thumbnail Navigation
A responsive, fullscreen image gallery/viewer with a thumbnail navigation, build using pure JavaScript and CSS. Your users are able to switch between images by click on the next/prev links and/or thumbnail images.
9. Responsive Photo Gallery with Pure JavaScript
A pure JavaScript gallery that helps you showcase your images with thumbnails and arrows navigation. Fully responsive and mobile touch friendly.
10. FlexImages
FlexImages is a simple vanilla JavaScript library to create a responsive fluid thumbnail gallery that supports images, videos, iframes, plain text and more. Inspired by Flickr and Google Images.