All image uploads must be a .jpg (jpeg) or .png format. If you'd like to upload a .pdf, check out our article on adding a documents box:
Page Header images
Events, Projects, Project groups (Topics,) and hub pages can host a header image at the top of the page:
For these, using a width:height ratio of 4:1 is recommended, with a minimum width of 1200px. Adding a wider image is fine, we'll automatically optimize your image for the device the participant is using. You can adjust the height to make the image shorter if you feel the image takes up too much of your page.
Question Header Images
For images associated with questions, generally look to target a 3:2 width:height ratio with a minimum width of 800px. We'll optimize these for the user's device as well.
Keep in mind detailed images are fine to use, as participants will have the option to zoom images to full size on desktop, or pinch to zoom on mobile.
Image selection questions are designed to show the full image provided for each option. This is done with dynamic styling to match the size of your image, with a bias towards showing the full image:
As you can tell from the above example, different size images can be used, but we'd recommend using all images of the same size. We recommend the 3:2 aspect ratio shown previously.
The option's image resolution will be dynamically determined based on the participant's device, so upload high-resolution images with a minimum dimension of 600px on the shortest side. Reminder: all images must be under 10MB.
When creating imagery for targeted Facebook & Instagram outreach, use the latest recommendations here https://www.facebook.com/business/help/103816146375741.
As of this writing, we recommend the full landscape aspect ratio of 16:9, with a majority of the key content towards the center of the image for cases when the Instagram will also be used.
Project Icons (Optional)
When displaying projects on a hub, you can visually differentiate them by using a project icon. These are square and should have a minimum width of 128 pixels. You can go bigger, we'll optimize these to a smaller size.
On the customer settings page, you can set a default accent color. This will affect a number of aspects of the user experience, including the default color while content is loading, questions that are selected, and prominent colors in interactive graphs.
Keep in mind you can further customize styling using the site-wide Customer CSS options on the Customer Settings page, create custom styles on the project settings page, and even apply question-level CSS in the question editor modal dialog.
Email design is covered on the Creating Custom Email Templates for your organization article.