X Header Resizer
1500×500 with the avatar circle, the mobile buttons and the downscale that makes your text unreadable.
Fills the space around a contained image.
X shows the header at 600×200, so type is rendered at 40% of this.
Dims the profile photo circle and the buttons X draws on top. Never included in the download.
Why header text has to be so large
| In the file | Rendered | Verdict |
|---|---|---|
| 16px | 6px | Too small |
| 24px | 10px | Too small |
| 32px | 13px | Readable |
| 48px | 19px | Readable |
| 72px | 29px | Readable |
Drop an image here
or paste a screenshot with Ctrl+V. Nothing is uploaded.
Everything here runs on your device. Nothing you enter is uploaded or stored.
An X header is the one banner where the file size and the display size are so far apart that the difference is the whole problem. You upload 1500×500 and the desktop web app shows it at 600×200.
How to use it
Drop in your artwork. The preview shows the header at full size with three things drawn on it: the circle where your profile photo sits, and the two spots where X paints its own buttons on mobile. Move anything that has to be read out of those, then download.
The 600×200 problem
X asks for 1500×500 and then renders it at 600×200 on a profile page. That is a 0.4 scale, and it applies to every detail in the image. Type set at 24px in your design tool is 10px on screen. A one-pixel hairline disappears entirely.
The tool asks for the size of your largest text and tells you what it becomes. Below roughly 32px in the file, you are under 13px rendered, which is where reading stops being comfortable. Most headers that “look blurry” are not blurry at all — they are correctly rendered at a size nobody chose.
Three things sit on top of your image
None of them crop it. The pixels are all still in the file; they are just underneath something.
- Your profile photo. A circle about 334 pixels wide in header coordinates, centred on the bottom edge, so half of it overlaps the image and half hangs below into the profile body.
- The mobile back button. Top-left, drawn straight onto the header.
- The mobile search and menu buttons. Top-right, same treatment.
What is left is a rectangle starting to the right of the avatar and below the top row of buttons. The tool states its pixel size as you work, because “keep it clear of the corners” is advice you cannot check against.
The other sizes worth having
The header is the reason you came, but the same image often needs to be a few other things:
- Profile photo, 400×400. Uploaded square, always shown as a circle, and displayed at 32px beside a reply. A face fills that; anything else is a smudge.
- Single post image, 1600×900. 16:9 fills a timeline card without a crop.
- Square post, 1080×1080. Uses more vertical space in a mobile timeline, which is the point.
- Link card, 1200×628. The shape of a large summary card. Below 300×157 X falls back to a small square card instead.
What it does not do
It does not upload anything, so it cannot change your profile — you download a file and set it yourself. It does not add text or graphics; bring finished artwork. And it will not quietly enlarge a small source: if your image is under 1500 wide, the warning tells you by how much before you commit.
Which tool for which job
| You want to | Use |
|---|---|
| An X header with the avatar zone | This tool |
| A LinkedIn banner with the photo overlap | LinkedIn Banner Resizer |
| A YouTube banner with four device crops | YouTube Banner Resizer |
| A circular avatar with centring guides | Profile Picture Maker |
| Any custom pixel size | Image Resizer |
Your image is decoded and re-encoded on your own device with the browser’s File and Canvas APIs. Nothing leaves the page, and closing the tab leaves no copy behind.
Questions
What size is an X header?
1500×500, a 3:1 strip. That is the size to upload, but it is not the size anyone sees. On the desktop web app X displays the header at 600×200, so every pixel of your artwork is shown at two fifths of the size you designed it. A 20px caption becomes 8px. The dimensions are trivial; the scale factor is the part that ruins headers.
Where does the profile picture cover the header?
The bottom-left. The avatar is a circle roughly 334 pixels across in header coordinates, centred on the header's bottom edge — so its upper half sits over your image and its lower half hangs below. The tool draws it and reports exactly how much of the corner it eats, along with the clean rectangle that is left.
Why is my header text unreadable?
Almost always the 1500 to 600 downscale. Your text looks fine at full size in the editor, then renders at 40% on a profile page. The rule of thumb this tool computes for you is that anything under about 32px in the file drops below a comfortable 13px on screen. Enter your text size and it will tell you what it becomes.
Does anything else cover the image?
On mobile, yes. X draws a back arrow over the top-left corner and a search and menu pair over the top-right, directly on top of the header rather than in a bar above it. Both are marked in the preview. Combined with the avatar, the reliable region is the middle and right of the frame, below the top edge.
Will the guides end up in my file?
No, and that is worth being explicit about — a resizer that bakes its own guides into your download is worse than no resizer. The overlays are drawn on the preview canvas after your image. The download re-renders from your image alone, and so does a batch export, so every file in the ZIP is clean too.
Last updated