Sometimes when previewing or viewing branded gift card designs, you may notice there are slight issues with "blurry" edges around your images, especially if your images use text.

Assuming you've provided your files at our required dimensions, there are several important aspects to note about this issue:

  • When a gift card is viewed on a smaller screen (or our special preview screen), we show them at a smaller size than some of your users may see the gift card at when using a larger desktop, laptop or tablet. This causes the images you provide to be "scaled down" to fit properly.
  • When an image is scaled down, the browser has to perform mathematical calculations in the background to determine the best size and then render the image for the viewer. Because these dimensions can sometimes result in odd dimensions (such as a width of 100.5 pixels, for example), there are disparities in how the images are shown on screen. This is typically most obvious at the edge of text or sharp lines (such as the edge of a shape).
  • Different browsers may render the image files slightly differently.
  • Except for the background.png file, we never "scale up" your images. In other words, they are never made bigger than the sizes listed on our file requirements page. As mentioned both there and here, background images do get "scaled" up on larger screens and this can result in some unavoidable "blurriness" so we often recommend blurring your background slightly in your design, sticking with a solid color or providing, after discussing with our support team, a large file.
  • There is, unfortunately, little that we can do about this problem because it would require us to anticipate a potentially unlimited number of sizes that your images could be shown at and optimize the code for every situation.
  • This issue is not unique to our service; many websites that use responsive CSS have issues like this.
  • Photographs tend to be more forgiving, so if this is a particular concern for you, you may want to consider limiting the amount of text in your design or not using it at all.
  • At this time, we cannot use SVG or other vector based technology to render images.
  • At this time, we cannot use responsive image loading.

For advanced users, a good solution can sometimes be to provide us with your coverage.png, card.png and bg.png files at twice the outlined pixel dimensions (sometimes referred to as @2x) for high resolution devices. If you decide to use this approach, be sure to let us know when you submit your files. Please do not add "@2x" or similar label to file names.

We cannot use larger files for print-bg.png at this time.