> For the complete documentation index, see [llms.txt](https://guides.mangoapps.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://guides.mangoapps.com/admin-guide/branding/image-recommendations.md).

# Image Recommendations

### Overview

This guide provides recommendations for optimal image sizes tailored to different intranet use cases.

***

### Banner Configuration

> Recommended sizes 
>
> Web: 1920 x 400 px
>
> Mobile: 750 x 450 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2F9BOgoV69i0r6ie2HoHZa%2F06-01-2025-01-31-13.png?alt=media&amp;token=da32592f-0d6f-47b4-a498-d187ac1ee7ca" alt="" width="563"><figcaption></figcaption></figure>

For information on changing the Home module banner configuration, click [here](https://guides.mangoapps.com/admin-guide/branding/full-portal/home-page-modern-vs.-classic-view#background-image).

***

### Company Banner Image

> Company Banner: 1200 x 96px
>
> Company Hero: 1920 x 150 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2F4ZAbArohpljS70xu1q73%2Ftryjetyrtjt.png?alt=media&amp;token=2b8d5baf-b413-4a5b-991e-d90282ab337b" alt=""><figcaption></figcaption></figure>

Learn about Company Banner Images [here](https://guides.mangoapps.com/user-guide/company/company-toolbars-admin#company-header-settings).

***

### Course Catalog Image

> Recommended size: 300 x 300 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FOaSMf9RkIq4RLSzXyMk0%2F25-09-2025-12-02-28.png?alt=media&amp;token=a489ba39-41ba-4599-a56e-851fd5a5d23a" alt="" width="563"><figcaption></figcaption></figure>

***

### Course Image

> Recommended size: 1280 x 790 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FupQzy2KP0oLAcqCqlQlN%2F25-09-2025-11-52-33.png?alt=media&amp;token=876569e2-2e28-4bec-a262-7c2a7a29a478" alt="" width="563"><figcaption></figcaption></figure>

***

### Event Photo/Icon

> Recommended size: 250 x 250 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FPokCcx9YlXURjcrSOIl6%2F26-06-2024-10-26-41.png?alt=media&amp;token=31bb73a7-d898-4aaa-bbb7-fe74ab08926a" alt="" width="375"><figcaption></figcaption></figure>

***

### Greeting/ Recognition Image

> Recommended size: 600 x 314 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2F3Vck4SKZkglC8rnwEe8L%2F28-06-2024-08-38-20.png?alt=media&amp;token=dfed334d-4b2a-4bb1-8584-1d3b763cbc36" alt="" width="563"><figcaption></figcaption></figure>

***

### Group, Department, Project Picture

> Recommended size: 250 x 250 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FZRkzIypgdvNmjYV981vw%2F28-06-2024-09-35-08.png?alt=media&amp;token=19387358-7498-4609-bb55-3b0bc38ca32c" alt="" width="563"><figcaption></figcaption></figure>

***

### Group, Department, Project Banner

> Recommended size: 1200 x 96 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2Fbaiuj4mP8DtrY9iH1Zc3%2F06-01-2025-11-32-13.png?alt=media&amp;token=5bcfeec9-4f7f-4acc-a094-51d11e12fcb6" alt="" width="563"><figcaption></figcaption></figure>

***

### Logo & Favicon

> Recommended size:  Logo :- 200 x 45 px | Favicon :-  16 x 16 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FwJf9fLxlnnZvCa1kE44m%2F06-01-2025-01-18-13.png?alt=media&amp;token=3b5cc01e-3625-463f-827a-7ee36503cd63" alt="" width="563"><figcaption></figcaption></figure>

***

### Media Center - Set Featured Image

> Recommended size: 402 x 248 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FzhGw9FYSP9w6hd4kPnJV%2F06-01-2025-02-02-11.png?alt=media&amp;token=54cbca2d-14cd-4797-9f9a-ed52ddda829b" alt="" width="563"><figcaption></figcaption></figure>

For information on items within the media center, click [here](https://guides.mangoapps.com/user-guide/media-center).

***

### Multimedia Widget

> Recommended size: 1250 x 773 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FV6aXEIiduk7kNXDKODfE%2F24-10-2025-11-41-48.png?alt=media&amp;token=1243b0a9-baca-4751-80f8-aa5d94cd3b3f" alt="" width="563"><figcaption></figcaption></figure>

***

### Post - Featured Image

> Recommended size: 1250 x 773 px&#x20;

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FivNEKYhusjvC4oWgoh3I%2F06-01-2025-11-45-47.png?alt=media&amp;token=25678f98-f16a-46ab-9f51-727afa434b1c" alt="" width="563"><figcaption></figcaption></figure>

For information on Post Featured Images, click [here](https://guides.mangoapps.com/user-guide/posts/compose-a-post#id-5.-feature-image).

***

### Post - 'Image' Block

> Recommended sizes:&#x20;

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2Fd6NNZ8A0JEGdSh8wpwdC%2Ftwertwe.png?alt=media&amp;token=a51851a4-10d3-453e-bfae-b75b08661308" alt="" width="563"><figcaption></figcaption></figure>

***

### Post 'Image + Text' Block

> Recommended sizes:&#x20;

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FP6HVo7DIIZo1ju6ZfoW2%2Fewrgwe.png?alt=media&amp;token=2e932105-4360-49ea-9a71-7316dbfbd552" alt=""><figcaption></figcaption></figure>

***

### Post - Promotion Banner

> Recommended size: 1680 x 106 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2F2AQQbP9t2INJdXAb85ZR%2F04-12-2024-12-02-52.png?alt=media&amp;token=baeb11d5-db0f-4651-a670-ca72ca3ec696" alt="" width="563"><figcaption></figcaption></figure>

Learn about Promoted Posts [here](https://guides.mangoapps.com/user-guide/posts/compose-a-post#id-7.5-post-promotion-admin-only-company-post-only).

***

### Post 'Video' Block - Thumbnail

> Recommended size: 1250 x 773 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FX9PGFg5rnHNcW5J3e3Bf%2F23-04-2024-02-48-45.png?alt=media&amp;token=31a6a24f-9876-4f2e-acb6-2cad4f452317" alt="" width="375"><figcaption></figcaption></figure>

***

### Profile Photo

> Recommended size: 250 x 250 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FmICDQa1yv6M6Zp3NpNWh%2F26-06-2024-08-30-09.png?alt=media&amp;token=5e1ab60c-18e2-4580-a1d6-982a6a346950" alt=""><figcaption></figcaption></figure>

Learn where to upload this image, [here](https://guides.mangoapps.com/user-guide/people-directory-and-profiles/user-profile/edit-your-user-profile#uploading-a-profile-picture).

***

### Survey Banner

> Recommended sizes are:&#x20;
>
> 1920 × 150 px for web
>
> 393 × 100 px for mobile.

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2F9LpChEf7uw7HcmL50bwL%2F07-05-2026-10-51-22.png?alt=media&amp;token=3dc1e3f1-b7d0-4935-875b-80e34fc13bfb" alt="" width="563"><figcaption></figcaption></figure>

***

### Survey Completion Message Image

> Minimum size is 200 × 200 px
>
> Recommended size is 1024 × 1024 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FeZJIbPGsV5BcZ6RKfcOn%2F07-05-2026-11-36-48.png?alt=media&amp;token=711e34b0-ed93-414b-86b9-67c90f9f2da6" alt="" width="386"><figcaption></figcaption></figure>

***

### Tracker Forms - Headers Image/ Logo

> Recommended size: 600 x 200 px

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FT4bQEfGviB1ZyCrJlIJk%2F06-01-2025-02-27-02.png?alt=media&amp;token=0069cada-673c-4256-a8d6-c93e654d491c" alt="" width="375"><figcaption></figcaption></figure>

For information on Tracker Forms, click [here](https://guides.mangoapps.com/user-guide/trackers/forms/edit-a-form).

***

### Widget Header Images

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FDxqbu3CqhPzE9Oh5tE03%2F03-04-2024-11-25-55.png?alt=media&amp;token=a2c545a4-bc40-425c-b72b-5136752cc24d" alt="" width="563"><figcaption></figcaption></figure>

| Width of Widget | Minimum px   | Recommended px |
| --------------- | ------------ | -------------- |
| 1 Column Widget | 400 x 96 px  | 600 x 144 px   |
| 2 Column Widget | 800 x 96 px  | 1200 x 144 px  |
| 3 Column Widget | 1200 x 96 px | 1800 x 144 px  |

***

### Wiki Banner

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FjsgltpX3ZDsgm1ZQUVGe%2F25-09-2025-12-58-07.png?alt=media&amp;token=3c7faacf-96d6-4147-b8df-70bc24aeca0b" alt="" width="563"><figcaption></figcaption></figure>

**Recommended Size:** Upload a banner image at **1920x180px** for best results.

**Visible Area:** Depending on the layout, about **950px of the width** will be visible in the central content area. Any important elements, such as titles or text within the image, should be placed within this visible region.

<figure><img src="https://1733114811-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lclpq021Ai9jH1_X4gO%2Fuploads%2FLZ7069BzVUnfuj9UFQP8%2Fbertbsrt.png?alt=media&amp;token=f3d1b2b3-0bd4-4a37-a1b1-679fa05674c4" alt="" width="375"><figcaption></figcaption></figure>

**Page Layout Impact:**

* On **full-width pages**, the banner stretches to fit across the screen.
* On **fixed-width pages (1200px)**, the banner is cropped to fit, which means content near the edges of the image may not display.

**Best Practice:** Keep key design elements (like titles or logos) centered within the image so they remain visible across all layouts.