General Recommendations for Image Sizes¶
These are valid for all resource types: backgrounds, logos, and other images.
Accepted File Types and Sizes¶
All images and graphics should be uploaded to a folder in your media library. Here are the file size limits for each file type. The sizes refer to one single file/asset, and not to all the files that can be loaded within a gameplay.
| max. 700 KB: |
max. 1 MB: |
max. 3 MB: |
max. 5 MB: |
|---|---|---|---|
| - PNG - JPEG / JPG - TXT - DOC - ICO |
- GIF |
- TTF - WOFF - WOFF2 - EOT - MP3 |
- SVG - XLSX / XLS |
We suggest that you save all images at 72ppi resolution to reduce file sizes. If your files are still too large, you can use a tool like TinyPNG.com to compress the files.
For all images, there is a maximum width of 2560px.
Note: You can link to a video that is hosted on YouTube, Vimeo, or in your own Content Management System.
Dimensions for Background Images¶
Your background images will display differently based on how much content you have on your landing page and what size screen your participants are using. There is not one, perfect size for a background picture, if it should be full-screen.
For mobile devices the display will have a high pixel density, meaning that the logical pixels are not the same resolution as the physical pixels. This means that the rendering scale will affect the quality that the screen can contain. You might have heard the word Retina which is a simple way of explaining this.
Below you will find the resolutions we recommend opting for when making a background image for mobile while optimizing for Retina.
Mobile background for entire landing page¶
- MAX: 900 x 1800px
- MIN: 750 x 1334px
Dimensions for Other Images¶
The below are just general guidelines. If in doubt, create larger graphics, since they can be cropped or downscaled. Too-small graphics will become grainy if scaled up.
Logo¶
100–450 pixels wide, usually saved as .png.
Game graphics¶
Usually between 200x200 – 600x600 pixels, depending on the game type. See our game-specific guides for more information.
Other landing page images¶
Usually between 200x200 – 400x400 pixels (wider for full-width banner images). These images might be added to game flow pages or landing page sections above or below the game flow.
Pre-loader (displays while the landing page loads)¶
Recommended maximum 200x200 pixels for the fastest possible load time, usually saved as .png.
Automatic game graphic adjustment¶
Now your .png and .jpg images will automatically downscale to fit the game, and the new version of the image will be added to your media library.
If the dimensions of your graphics don't match the game's requirements, you will be prompted to crop your image to a size that fits. The image cropping tool will show you the correct size.
Note: this change will only affect the pixel size of your images. The file size limits (700kb for most images) remain.