> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.superpath.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Best Sizing for Images in SuperPath

# Best Sizing for Images in SuperPath

**In this article:**
* Overview
* Recommended image sizes
* Dashboard and Library banners
* Cover images
* Thumbnail images
* Login image
* Things to keep in mind

## Overview
When adding images in SuperPath, following the recommended sizing guidelines keeps your visuals sharp and professional, and stops them from being cropped or stretched. Different areas of the platform use different dimensions, so this article sets out the best size for each.

## Recommended image sizes
| Area | Aspect ratio | Recommended size | Positioning |
| --- | --- | --- | --- |
| Dashboard banner | — | Height fixed at 250px; width expands with the page | Fixed to the top left |
| Library banner | — | Height 280px; width expands with the page | Fixed to the middle left |
| Pathway / Section / Knowledge / Event cover | 24:5 | 1920 × 400px | Top, Middle or Bottom |
| Content cover | 16:9 | 1920 × 1080px | Top, Middle or Bottom |
| Thumbnail | 1:1 | 200 × 200px | — |
| Login image | Landscape | Expands with the page | — |

## Dashboard and Library banners
Banners have a **fixed height** and a width that expands to fill the page:

* **Dashboard banner** — 250px high (fixed), fixed to the top left.
* **Library banner** — 280px high, fixed to the middle left.

## Cover images
Cover images grow with the page size, and their vertical alignment can be set to **Top**, **Middle** or **Bottom** if the image is too tall:

* **Pathway, Section, Knowledge and Event covers** — 24:5 ratio, recommended 1920 × 400px.
* **Content covers** — 16:9 ratio, recommended 1920 × 1080px.

## Thumbnail images
Thumbnails are used in lists and steps across SuperPath — Library content, Pathways, Sections and Roadmaps. Use a **1:1** ratio, recommended 200 × 200px.

## Login image
Use a **landscape-oriented** image for the login screen, as it expands with the page.

## Things to keep in mind
* Banners have a fixed height but a width that grows with the page, so design the important content to sit within the visible band.
* Cover images grow with the page; use the Top / Middle / Bottom positioning to control which part stays in view when an image is tall.
* These are recommendations for the best result — images outside these dimensions will still upload, but may be cropped or appear less sharp.