Responsive Image Gallery

The responsive image gallery is the default gallery layout for FooGallery. It comes in a dark and light theme and you can customize the hover effects and captions.

This is a basic but versatile gallery layout. The thumbnails for the gallery are all a standard size, the dimensions for which you can set in the general settings. You can add a border, outline, or shadow to your thumbnails for a bit of variety.

Because the thumbs are a standard size, images are cropped to fit inside the thumb area. Pro users, however, can choose to not crop the images and fill the background space.

Below you can see two responsive image galleries, one with the dark theme and one with the light theme.

Dark Theme

Light Theme

Customize Your Responsive Image Gallery

There are so many ways to customize your responsive image gallery to make it look perfect for your brand or company. You can change almost every aspect including:

  • Thumbnail size
  • Lightbox
  • Spacing (between 5px – 25px, or none)
  • Alignment (left, centre, right)
  • Theme (dark, light or custom)
  • Border Size (none, thin, medium, thick)
  • Rounded Corners (none, small, medium, large, full)
  • Drop Shadow (none, outline, small, medium, large)
  • Inner Shadow (none, small, medium, large)
  • Loading Icon (6 options, or none)
  • Loaded Effect (fade-in or none)
  • Hover Effect – Theme (dark or light)
  • Hover Effect – Color Effect (none, colorize, greyscale)
  • Hover Effect – Scaling Effect (none, scaled, zoomed)
  • Hover Effect – Caption Visibility (none, on hover, always visible)
  • Hover Effect – Transition (instant, fade, slide, push)
  • Hover Effect – Icon (7 options or none)

As you can see, the responsive image gallery is a standard gallery layout. But it can be tweaked to make a big impact on your users.

Did you know? Once you’ve found the settings you like, you can set these to be your gallery settings for all future galleries. In other words, any time you create a gallery, these settings will automatically be applied as the default gallery settings. This means you won’t need to change the settings for each new gallery, as it will simply inherit the default settings you have selected. For more info on how to do this, read this article.

Can’t wait to get started?