

Instead, start with an image that is at least 1500 pixels wide. Squarespace doesn't recommend enlarging a smaller image, as this can make it appear pixelated. You can reduce an image's dimensions in the Adobe Creative Cloud Image Editor, or use third-party software.


This can cause page loading issues if the image is over 2500 pixels along its longest edge. However, images added through the Style Editor (background images and site-wide banner images) load at their original dimensions. In most cases, Squarespace will reformat large images to a maximum width of 2500 pixels. Images smaller than 1500 pixels may appear blurry or pixelated when they stretch to fill containers, such as banners. Squarespace recommends using images that are between 15 pixels wide. The dimensions of the original image you upload to your site can have a big impact on how it displays. If images don't look right on mobile devices, it's probably because they don't have an sRGB color profile. Print mode (CMYK) won't render in most browsers. For example, an image with dimensions of 1500px x 1650px is 2.475 MP. Tip: To find the MP for an image, multiply the dimensions and divide by one million. There is an image resolution limit of 60 MP (megapixels). When it comes to image size, bigger isn't always better, as uploading larger images can affect site performance. Squarespace recommends using image files of less than 500 KB for best results, though the limit for an individual image upload is 20 MB. Other characters (like question marks, percent signs, and ampersands) may upload incorrectly or cause unexpected behavior in galleries. Only use letters, numbers, underscores, and hyphens in file names. When uploading images to your site, follow these guidelines: File types We recommend loading these images with a maximum of 2500 pixels along their longest edge. Note: Images uploaded via the Style Editor, such as background images, always display at their original image width. Squarespace's built-in responsive design picks the appropriate image size based on the visitor's screen. The height changes relative to the width to preserve the image's aspect ratio. When you upload an image, Squarespace creates up to seven versions of that image, each with a different width. For best results, follow the suggestions below.
#Squarespace overlay text on image how to
They create seven variations of each uploaded image, to ensure perfect display on any screen size.īelow are some recommendations on how to format your images before uploading them. Squarespace takes the guesswork out of formatting your images for display on the web.
