The original image that you upload to the website is always retained and never actually cropped on the back end. What is displayed on a page is a copy of the original image.
This guide lists the image display ratios for each component.
We do not recommend tightly cropping images before uploading them to the site. Instead, to ensure the most flexibility in the display of your image, we recommend uploading a full image and using the focal point setting to guide which part of the image will be displayed. If you're adding an image to a Text Area, you can also choose the appropriate styling: scaled or cropped.
Additionally, keep in mind that how an image appears on your site will often adjust based on the width of the user's screen.
Because Banner Images are stretched along the page, you'll need a wide landscape orientation. Some styles of Banner Image are taller or shorter than others, as you can see in the image size recommendations below.
Banner Image: 2400*600 pixels
Banner Image(s) with Partial Overlay and Text: 2400*980 pixels
Banner Image(s) with Text Box: 2400*980 pixels
Banner Image with Full Overlay and Text: 2400*980 pixels
Vertical Cards, Vertical Linked Cards, and Vertical Button Cards: Images are landscape with a ratio of 1.44:1. We recommend uploading an image of at least 2400*1666 pixels. Cropping will happen according to the focal point.
Images in a Text Area
For sizing, you can choose between Small, Medium, Large, and Extra Large. For shape, you can choose between Scaled, where the image retains its proportions, or Square, where the image appears cropped in equal proportions top-bottom and left-right.
Full Content Sizing: The image automatically scales to fit the width of the text area. If the image's original width is smaller than the text area, it will display at its original size without scaling.
Square Image Sizing: Selecting this option will format your image with equal top-bottom and left-right dimensions. If the original image is not square, the center portion will be used with the edges cropped to fit the square format. However, if the focal point is moved off-center, the crop will adjust to ensure the focal point is included in the final image. Learn more about changing the image focal point.
For best results, we recommend using images that are double the displayed dimensions to ensure the resulting image remains clear and detailed.
Size
Dimensions
Recommendations
Large Square
480 x 480 pixels
Use images at least 960 pixels wide and tall.
Medium Square
360 x 360 pixels
Use images at least 720 pixels wide and tall.
Small Square
200 x 200 pixels
Use images at least 400 pixels wide and tall.
XL Square
700 x 700 pixels
Use images at least 1400 pixels wide & tall.
Scaled Image Sizing: These images are scaled by width, with the height adjusted proportionately. The aspect ratio of the original image is maintained, and no cropping takes place.
We recommend using images where the width is at least double the displayed dimensions to ensure the resulting image remains clear and detailed. Images that are below the pixel width will be upscaled, which may reduce clarity.
Size
Dimensions
Recommendations
Large Scaled
The image is scaled to a width of 480 pixels, with the height adjusted proportionally.
Use images at least 960 pixels wide.
Medium Scaled
The image is scaled to a width of 360 pixels, with the height adjusted proportionally.
Use images at least 720 pixels wide.
Small Scaled
The image is scaled to a width of 200 pixels, with the height adjusted proportionally.
Use images at least 400 pixels wide.
XL Scaled
The image is scaled to a width of 700 pixels, with the height adjusted proportionally.