Banner design: web, social and print banners that read

Good banner design works with the shape instead of against it. A banner is wide and short, so give it one compact block of words, a short headline and perhaps one supporting line, placed where nothing will cover it, and let the background carry colour across the rest of the width. Check each platform's size and safe area first: a LinkedIn profile banner is 1584 × 396 pixels and loses its lower left corner to your photo, while a YouTube banner is 2560 × 1440 and shows only a central strip on phones.

Banner sizes for web and social

How to lay out words in a wide banner

People read a banner the way they read a line of text: left to right, quickly. Spreading words across the full width makes the eye travel too far. Group them into one block, roughly a third of the width, and set the headline large enough to read when the whole banner shrinks to the width of a phone screen.

Hierarchy has to be simple at this height. Two levels is usually the limit: a headline and a small line above or below it. If you need a third, it probably belongs on the profile itself. Visual hierarchy explains how size and spacing do this work without extra decoration.

Safe areas and cropping

Every platform crops or covers its banner differently on desktop and phone. The safe approach is the same everywhere: let the background run edge to edge, and keep words and logos within the middle of the frame, away from the corner where the avatar sits.

1. 1

   Find the covered corner

   On LinkedIn, X and Bluesky the profile photo sits over the lower left. Keep that area as background only.

2. 2

   Allow for phone crops

   Facebook and Etsy trim the sides on phones. Keep words inside the central two thirds of the width.

3. 3

   Use YouTube's central strip

   Of the 2560 × 1440 frame, only the middle area of about 1546 × 423 pixels shows on all devices. Put the name and any words there.

4. 4

   Check at real size

   Upload, then view on a phone and a laptop. A preview in a design tool can't show you the platform's interface, and platforms change their layouts, so check their own help pages before a big launch.

Print banners: roll ups and event signs

A roll up banner, commonly 850 × 2000 mm, is the opposite problem: tall and seen from metres away while people walk past. It needs a logo and a headline in the top third at eye level, very little in the bottom third, which hides behind tables and legs, and type large enough to read from across a room. Ask your printer what resolution they want; large banners are normally printed from files well under 300 dpi because nobody sees them up close.

For stands and stages, see event backdrop design, and for large paper formats, poster sizes.

One look across every banner

Most people need five or six banners at once: LinkedIn, X, YouTube, an email header, a website hero. They look like one brand when the background, type and colour stay constant and only the layout changes. A gradient is ideal for this because it has no subject to crop, as long as it is rendered for each shape rather than stretched.

In Gradiently, a Mark renders fresh at every banner size, moves its calmest region behind your words and lets auto ink choose light or dark type per line. With Pro, one design resizes to every size in one step, so the LinkedIn, X and YouTube banners arrive together. The idea of one recognisable background is covered in a signature look.