Make an X Header

How it works

Your reference image goes to an image-editing model with an instruction describing a wide header composition: safe margins around the avatar overlap, a clear focal subject, and space left for branding you add later. A second instruction rules out distorted subjects, unreadable text, watermarks, bad crops, and clutter.

The model composes a new picture rather than cropping yours, so it resembles your reference without reproducing it, and a second run gives a different header instead of the same one again.

The result is delivered at exactly 1500 by 500 pixels.

Both numbers were illegal

Most social formats need one dimension corrected. This one needed two.

Images are generated in a latent space where width and height must both be multiples of eight. 1500 is 187.5 eights. 500 is 62.5. Neither is allowed, and a generator handed those numbers does not complain — it rounds quietly down and returns 1496 by 496, four pixels short on each axis, with no error anywhere.

That file looks correct in a viewer and stops being correct at upload, when the platform rescales it to the size it expected. Everything ends up marginally soft and there is nothing in the file to explain why.

Here the image is generated at 1504 by 504, which is legal on both axes, and then scaled down to 1500 by 500. A four pixel reduction is invisible; a four pixel shortfall is not.

Designing for three to one

This ratio is unforgiving in a specific way.

At three to one there is almost no vertical room. Anything with height — a person standing, a tall building, a portrait subject — has to be cropped so severely that it stops being recognizable, and the generated composition inherits that constraint from the aspect it is drawn at.

What works instead is material that is already horizontal or has no orientation at all. Textures, gradients, patterns, horizons, repeating shapes, abstract color fields. These have no focal point that can be lost and no balance that can be broken when the ends are trimmed on a narrow screen.

The instinct to put one strong subject in the middle is the instinct to fight the shape. It is also the composition most damaged by the avatar.

The dark theme problem

This is the failure most people never diagnose, because they only ever look at their own profile, on their own theme.

Your header sits flush against the page. There is no frame, no border, no gap — the image ends and the interface begins. Whether that transition is invisible or glaring depends entirely on how close the header's edge tones are to the page behind them.

A header with a bright sky along the top, or white space at the sides, disappears neatly into a light page. Put the same image on a dark page and it becomes a glowing rectangle with four hard corners, obviously an image rather than part of the design.

The reverse is true too. A very dark header looks intentional in the dark theme and looks like a hole in the light one.

Mid-tone edges are the answer to both. A header whose outer regions sit somewhere in the middle of the range meets either background without announcing itself, and it is the one thing worth checking that a preview in isolation will never show you.

The avatar

Your profile picture is a circle that sits over the header's lower left and crosses its bottom edge.

That is a large, round, opaque hole in a corner of an already shallow image, and it is fixed — nothing you put underneath it will ever be seen. Load-bearing content belongs in the upper right, which stays clear across layouts.

Generate, then look at your actual profile page rather than the file. The header in isolation and the header in place are different images.

Publication gate

This page ships once the workflow has been run against a texture reference, a horizon reference, and a portrait-oriented reference, with each output measured at 1500 by 500 and viewed on a live profile in both the light and dark themes.