What dimensions are best for an image header on a space homepage?
Asked by Devin Parker:

looking to add an image header and need to know what dimensions it should be.


Answers:
author: Gareth J M Saunders
body: After a bit of trial and error, I've found that for our Confluence Cloud instance, a header image of **950 ? 175 pixels** fits perfectly on a Confluence Space homepage, when it is in the narrow option, not fullwidth.

![confluence-help-image.png](https://community.atlassian.com/t5/image/serverpage/image-id/197244i2F35DAF09C34804C/image-size/large?v=v2&px=999 "confluence-help-image.png")

comments: author: Michael MacLean
body: Thanks, and full width?


author: Lekhoni Banerjee
body: Hi

I didnt use any code, but found out for a 1920\*1080 resolution of monitor if we keep the width of image 1799px, and any height, the original size fits well in a single column section.

![atllassian com.png](https://community.atlassian.com/t5/image/serverpage/image-id/119953i798C24B342D37F13/image-size/large?v=v2&px=999 "atllassian com.png")I am still exploring 2 column and 3 column sections.

Thankyou


author: Diego
body: Hello there!

After some fiddling with an image header locally. What I found out is that we reach the ++*maximum width of our header as soon as we reach a height of 250 pixels.*++

I took a screenshot of the maximum width that a header image can reach. For this screenshot, I used a width of 700 pixels. Here, take a look:
> ![ConfluenceHeader700px.jpg](https://community.atlassian.com/t5/image/serverpage/image-id/81040i0CEE3E7F3506BD3A/image-dimensions/482x240?v=v2 "ConfluenceHeader700px.jpg")

However, we can reach the same width by setting the height as 250 pixels. Here:
> ![WindowsHeader250px.png](https://community.atlassian.com/t5/image/serverpage/image-id/81041iFBD1B363C0FD57D8/image-dimensions/485x242?v=v2 "WindowsHeader250px.png")

**To finally answer your question, we can set the image width as 100% and the image height with a minimum of 250 pixels so you can reach the maximum width available for a header image.**

*++Here is an example of what I used on my instance:++*
> ![https://i.postimg.cc/LXNzLv55/windows1095-Version2.jpg\|width="100%](https://i.postimg.cc/LXNzLv55/windows1095-Version2.jpg|width="100%)", height="210"!

Keep in mind that I tested this with three screens:
> * *27 inches 1080p*
> * *23 inches 1080p*
> * *14 inches 1080p*

++*Results may vary aesthetically depending on screen resolution and size.*++

Let us hear from you, [@Devin Parker](/t5/user/viewprofilepage/user-id/1177237) ! Looking forward to your reply.

comments: author: David Alonzo
body: Could you please show the code used to create the image header with the height of 250 pixels?


author: Cynthya
body: After many trials and errors this finally worked for me - 1662 x 306 pixels.


author: anton.thelander
body: Looks like as of 2023-12-05 the height for the header image in Atlassian Cloud is 192 pixels, at least for me. Which means with a width of 2545 pixels in Brave Browser full screen, means the aspect ratio for the image is about 13.255:1 (the standard aspect ratio for a screen is usually 16:9 or the like).


Tags: atl-gruland

confluence-cloud