Skip to main content
Skip table of contents

Recommended Custom Image Formats

On this page you will learn which dimensions your images for the theme should ideal have, which file sizes your images should be and which image formats the Help Center theme is supporting.

The header logo is shown on the top left in the header navigation.

Allowed

Recommended

Image dimensions

Any dimensions are accepted but the image will be displayed with a maximum height of 40px.

Since a logo can differ of it’s dimensions, we recommend to create a image which uses the full height of 40px and has a minimum width of 40px.

Our image in this documentation has the dimensions of:
113x40

Image file size

Within the Confluence upload limit

~10kb

Image formats

JPG, PNG, SVG

SVG

Favicon

The favicon is shown in the browser tab and can be customized from the header settings in the theme editor.

Allowed

Recommended

Image dimensions

-

Since this is shown in the brower tab, we recommend to use the size of 32x32

Our image in this documentation has the dimensions of:
32x32

Image file size

Within the Confluence upload limit

~1kb

Image formats

JPG, PNG, ICO

PNG

Banner Image on Portal and Content Source Page (Hero Layout)

The banner image is shown in the top section of the content source page and portal page.

Allowed

Recommended

Image dimensions

Background image with no dimension settings.

Resizes to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges. Center point of the image is the top left corner. The fixed height of the shown area is 380px.

We recommend to use image dimensions which also serve larger screens, so the image won’t get blurry on these larger screens.
You could also use a SVG to prevent this issue.

Our image in this documentation has the dimensions of:
6027x2519

Image file size

Within the Confluence upload limit

~250kb

Image formats

JPG, PNG, SVG

PNG / SVG

Banner Image on Content Source Page (Detail Layout)

The banner image is shown in the top section of the content source page.

Allowed

Recommended

Image dimensions

Background image with no dimension settings.

Resizes to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges. Center point of the image is the top left corner. The fixed height of the shown area is 200px.

We recommend to use a image dimensions which servers also bigger screen so the image won’t get blurry on bigger screen sizes.
You could also use a SVG to prevent this issue.

For guidance, the banner image in this documentation has the dimensions of 6027x2519.

Image file size

Within the Confluence upload limit

~250kb

Image formats

JPG, PNG, SVG

PNG / SVG

The footer logo is shown on the bottom left in the site footer.

Allowed

Recommended

Image dimensions

  • maximum width: 100px

  • minimum width: 40px

  • maximum height: 80px

We recommend to use a image dimensions which uses the maximum width and height of 100x80 and leave a transparent background for space you might not need to use.

The image in this documentation has the dimensions of:
100x34

Image file size

Within the Confluence upload limit

~250kb

Image formats

JPG, PNG, SVG

SVG

Images Within the Articles

Scroll Viewport displays images in their original size. Learn how to resize images.

We recommend you respect the following for images within articles:

  • Keep the file size of images as small as possible. We recommend compress every image before uploading it to the Confluence page.
    A thumb rule for image file size is that an image should have a maximum file size of ~1mb.

  • Make sure your images are optimized in their dimensions. E.g. uploading an App icon with the dimensions of 500x500px.

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.