Image Dimensions Guide

Before you get started making your landing page, you always want to get your graphics, images, and content ready. We all know, beautiful images can make all the difference but its crucially important to know the optimal size. Below is a quick guide on what is the optimal image sizes for each of the Flauntly components that display images.

Logo

Optimal Size: Width 300 px X Height 46 px

For your logo to look its sharpest, we highly recommend using an SVG file type (Scalable Vector Graphics) If you are not familiar with, SVG files, you can learn more here.

logo dimensions
(Width 300 px) x (Height 46 px)

Hero

The hero image dynamically scales horizontally and vertically. On the horizontal axis, the image will stretch as wide as the browser and on the vertical axis, the image will stretch as tall as the content inside the hero component.

Hero image dimensions
Optimal Size: (Width 1920 px) x (Height 1080 px)

Wide image

Optimal Size: (Width 1080 px) x (Height 607 px)

Wide image dimensions
(Width 1080 px) x (Height 607 px)

Card list

Optimal Size: (Width 520 px) x (Height 293 px)

Card list image dimensions
(Width 520 px) x (Height 293 px)

Carousel

Optimal Size: (Width 1080 px) x (Height 607 px)

Carousel Image dimensions
(Width 1080 px) x (Height 607 px)

Text and images

Optimal Size: (Width 602 px) x (Any)

Text and image dimensions
(Width 602 px) x (Height Any)