Skip to main content Skip to secondary navigation

Image sizes and dimensions

Main content start

Content elements that include an image, like the Banner and the Card come pre-populated with image sizes.

In case you want to crop to the exact dimensions, here are the common sizes you will need to crop to. 

When you upload an image without cropping beforehand, Drupal will fit it into the space defined for the image. To get an optimal effect (and avoid unintended cropping) you’ll want to upload an image with dimensions that are close to the space defined for it. The resolution will be better if your image meets the recommended resolutions and sizes. 

In order to optimize site storage:

  • The resolution of the images should be set at 72 DPI 
  • The maximum size should be no larger than ~1920px wide
  • The color mode should be RGB 

Note: All image dimensions are width by height.

Top Banner and Banner

Aspect ratio: 30:11

3000px x 1100px recommended source size (72 DPI)  

Card Images (including Media with Caption)

Aspect Ratio — 2:1

2000px x1000px recommended source size (72 DPI)  

Image Resizing Resources

  • Photo Editor
    • Photoshop
    • Illustrator
    • Preview (available on Mac)
  • Photo Compression