Community theme image specifications

Refer to this topic when you are preparing the image files you'll need for the theme.

The following image file types are supported:

GIF
JPG or JPEG
PNG

Tip: If you want the image to have a transparent background, use PNG.

Note: For information about Adobe Photoshop templates you can download and use to start customizing your Community theme to match your organization's branding guidelines, see Community branding templates.

Portals/Discussions Header & Navigation

Image	Description
Header Image (used for portals and forums)	Recommended width: 1280 pixels Recommended height: 100 pixels Maximum file size: 2 MB
Mobile Header Image (used for portal only)	Recommended width: 750 pixels Recommended height: 50 pixels Maximum file size: 2 MB

Portals/Discussions Body

Image	Description
Background Image	Recommended width: 1920 pixels Recommended height: 1080 pixels Maximum file size: 4 MB Note: Remember to select a Background Image Style setting: Fit to screen: The image resizes to fit the screen. For the best results on as many screen sizes as possible, follow the recommended dimensions and preview the portal before going live. Tile: An image smaller than the full screen size is repeated across the background.

Image

Description

Background Image

Recommended width: 1920 pixels
Recommended height: 1080 pixels
Maximum file size: 4 MB

Note: Remember to select a Background Image Style setting:

Fit to screen: The image resizes to fit the screen.
For the best results on as many screen sizes as possible, follow the recommended dimensions and preview the portal before going live.
Tile: An image smaller than the full screen size is repeated across the background.

Discussions (Mobile Only)

Image	Description
Header Image	Recommended width: 240 pixels Recommended height: 65 pixels Maximum file size: 4 MB Note: Remember to select a Header Image Alignment setting: Left Center Right

Surveys

Image	Description
Header Image	Supported file type: JPG, PNG, and GIF Maximum file size: 2 MB Classic surveys: The header image appears in desktop view. Recommended height: 100 pixels Recommended width: 987 pixels. An image with a width of 987 pixels will stretch from the left edge to the right edge of the content area. Modern surveys: The header appears across all devices types and does not adjust to the size of the participants' screens. Recommended height: 100 pixels. Recommended width: 400 pixels Larger images are resized to 100 pixels height and the aspect ratio of the width is maintained. To avoid unintentionally cropping the header image on smaller screens, try: Using a narrower header image. Experimenting with Header Alignment options.
Page Background Image	Maximum file size: 2 MB Recommended width: 1920 pixels Recommended height: 1080 pixels
Footer Logo	Recommended width: 180 pixels Recommended height: 30 pixels Maximum file size: 2 MB

Surveys (Classic) Mobile

Image	Description
Mobile Header (also used for email branding)	The mobile header image is for classic surveys only. Modern surveys use the header image uploaded under Surveys > Header Image across all devices. Recommended width: 600 pixels Recommended height: 100 pixels Maximum file size: 2 MB Tip: Pick a color that matches the header image background. That way, if participants are viewing the survey on a screen wider than your header image, the header will still appear contiguous. For an optimal participant experience, test your survey on popular mobile, tablet, or desktop devices. Testing is the only way to review exactly how your survey will appear to participants on their specific devices.

Image

Description

Mobile Header (also used for email branding)

The mobile header image is for classic surveys only. Modern surveys use the header image uploaded under Surveys > Header Image across all devices.
Recommended width: 600 pixels
Recommended height: 100 pixels
Maximum file size: 2 MB

Tip:

Pick a color that matches the header image background. That way, if participants are viewing the survey on a screen wider than your header image, the header will still appear contiguous.
For an optimal participant experience, test your survey on popular mobile, tablet, or desktop devices. Testing is the only way to review exactly how your survey will appear to participants on their specific devices.