# 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="/files/zM6lA7Y17nVrneJnqUce" 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="/files/OSYFqRzEpxMfcNCnEGZh" 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="/files/mnTfQA7ktuebAJoJnLCy" alt="" width="563"><figcaption></figcaption></figure>

***

### Course Image

> Recommended size: 1280 x 790 px

<figure><img src="/files/zxTreXTwUjt1nVjGx5l2" alt="" width="563"><figcaption></figcaption></figure>

***

### Event Photo/Icon

> Recommended size: 250 x 250 px

<figure><img src="/files/aIFTO9vPNTdst1NSqZei" alt="" width="375"><figcaption></figcaption></figure>

***

### Greeting/ Recognition Image

> Recommended size: 600 x 314 px

<figure><img src="/files/bwMaJDSEbpxQ9rH7tiRd" alt="" width="563"><figcaption></figcaption></figure>

***

### Group, Department, Project Picture

> Recommended size: 250 x 250 px

<figure><img src="/files/FkqTmaYA037QeqnJLBNj" alt="" width="563"><figcaption></figcaption></figure>

***

### Group, Department, Project Banner

> Recommended size: 1200 x 96 px

<figure><img src="/files/iW9bBmCD4cwq08Lc6Ft0" alt="" width="563"><figcaption></figcaption></figure>

***

### Logo & Favicon

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

<figure><img src="/files/FT4gk6K0e2ndteZKRCKF" alt="" width="563"><figcaption></figcaption></figure>

***

### Media Center - Set Featured Image

> Recommended size: 402 x 248 px

<figure><img src="/files/10NzqZrIU1R67SRlneJk" 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="/files/rP6lnU8DDsHBuR3jCQ0j" alt="" width="563"><figcaption></figcaption></figure>

***

### Post - Featured Image

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

<figure><img src="/files/WIRbXvXHS4XGiVDh526t" 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="/files/6z0UYqLMupyC6XSOGwpb" alt="" width="563"><figcaption></figcaption></figure>

***

### Post 'Image + Text' Block

> Recommended sizes:&#x20;

<figure><img src="/files/kKTxQiYp7z2DaAjR0Kxz" alt=""><figcaption></figcaption></figure>

***

### Post - Promotion Banner

> Recommended size: 1680 x 106 px

<figure><img src="/files/P0qpZtF5bBsWBBZRe9Id" 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="/files/47lo3pZhmEFkzuA9Deaj" alt="" width="375"><figcaption></figcaption></figure>

***

### Profile Photo

> Recommended size: 250 x 250 px

<figure><img src="/files/c5z4YQdXkXMeMmBN1Zug" 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="/files/e61kFzm4WFZKzP3eFseP" 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="/files/hxt1wNh5s7k83fkmNV87" alt="" width="386"><figcaption></figcaption></figure>

***

### Tracker Forms - Headers Image/ Logo

> Recommended size: 600 x 200 px

<figure><img src="/files/ceU9Hu2E1mYpKb2tzBcf" 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="/files/ltBPMP1pKJVlwcYuJHZN" 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="/files/97gjMExMMyHn3b1mkTD8" 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="/files/0els56r4gA4muNSs6VCZ" 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.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guides.mangoapps.com/admin-guide/branding/image-recommendations.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.