The short version
- Twitter branding on X rests on four visuals: the avatar, the 1500×500 header, post images and the link cards your website produces.
- The avatar appears beside every post and reply, so it should be a simple symbol or tight portrait that reads at a very small size.
- X post images work best at 1600×900 for landscape or 1080×1350 for portrait.
- Link cards come from your website's meta tags, so a 1200×630 Open Graph image in your brand look makes every shared link recognisable.
- Using the same background family on the header, post images and link cards ties scattered posts into one visible brand.
On this page
Twitter branding on X comes down to four visuals you control: the avatar beside every post, the 1500×500 header on your profile, the images you attach to posts, and the link cards your own website produces when someone shares it. Most of the time people meet you as a small circle and a few lines of text in a fast feed. So each visual has to be simple, and all four have to look like they came from the same place.
Your X brand kit at a glance
Where people see it
Where people see it
Size
Where people see it
Size
Where people see it
Size
Where people see it
An avatar that survives the timeline
Your avatar is the most repeated image you have. It sits beside every reply, in notifications and in other people's quote posts, often smaller than a fingernail. A full logo with a wordmark disappears at that size. Use a single symbol, a monogram or a tight head and shoulders portrait, on a solid or softly lit background in your brand colour. Keep it the same on every platform, so people who follow you elsewhere spot you instantly.
Designing the X header
The header is 1500×500, a 3:1 strip. The avatar overlaps its lower left, and different screens crop the top and bottom slightly, so keep words in the middle band and away from that corner. One line works best: what you make, what you are building, or the one thing you want a visitor to remember. Pin a post that expands on it. X header size has the safe areas in detail.
One line, placed centre right, on the same background the account uses for every post image.
Treat the pinned post as the second half of the header. A visitor reads the line in the header, glances at the bio, then sees the pinned post directly underneath. Make that post the best short introduction to what you do, with an image in the same look, and refresh it when you have something better to show. A few that work well:
- A one image introduction: who you are, what you make, what to expect if they follow.
- Your best thread, with a numbered cover image so it reads as a series.
- A current launch or offer, replaced as soon as it ends so it never goes stale.
Post images that look like yours
Most posts on X are words, and they should stay that way. Add an image when it does a job: frames a key line, shows a result, announces something, or carries a chart. When you do, use a small set of layouts on one background family so people learn to recognise them mid scroll.
A landscape update card at 1600×900. One number, one line of context.
A portrait quote card at 1080×1350, which takes up more of a phone screen.
Keep the type large: people read X on phones, and the timeline shows images smaller than you designed them. Two or three words per line, one idea per image. X post image design and X thread graphics have more layouts, including numbered images for long threads.
Link cards are part of your brand
Every time anyone shares your website on X, the card that appears comes from your page's meta tags. Without them, X shows a plain link or a random crop. With a 1200×630 image in your brand look, every share, including ones you never see, carries your look into the timeline. X reads its own twitter: tags first and falls back to Open Graph.
<meta name="twitter:card" content="summary_large_image">
<meta property="og:title" content="Small tools for big spreadsheets">
<meta property="og:description" content="Import, clean and merge files in seconds.">
<meta property="og:image" content="https://example.com/og/home.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">Design the link image like a tiny poster: page title, a short line, your brand background, generous margins because X rounds the corners. Open Graph image size covers testing and caching.
Twitter branding mistakes to avoid
Avoid
- A detailed logo as the avatar
- A header crowded with a slogan, handle and website
- Words in the header's lower left corner
- Screenshots with tiny text as post images
- Leaving link cards to chance
Do
- A simple symbol or portrait, kept for years
- One clear line on a brand background
- Text centred or right of centre
- Large type, two or three words per line
- A designed 1200×630 card for every key page
The simplest way to keep all five pieces in step is to make them from one design. In Gradiently you can design once on a Mark and, with Pro, resize to every format in one step, so the header, post cards and link image share the same light and colour. The Mark makes room for your words at every size, which matters on a 3:1 strip where there is very little room. For the multi platform view, read consistent branding across social media.
Questions people ask
What size is the X (Twitter) header?
1500×500 pixels, a 3:1 ratio. Keep words in the middle band and away from the lower left, where the avatar sits.
What size should images be for posts on X?
1600×900 for landscape or 1080×1350 for portrait. Portrait images take up more space on phones.
Should my X avatar be a logo or a photo?
Use whichever reads clearly as a tiny circle: a simple symbol, a monogram or a tight portrait. Avoid detailed logos and small text.
How do I control the image when my website is shared on X?
Add a twitter:card tag set to summary_large_image and an Open Graph image of 1200×630 pixels to each page's head.
How can I make my X profile look more professional?
Use the same simple avatar everywhere, a header with one clear line, and post images that share one background family and typeface.
Written by Gradiently
The team behind Gradiently, a design tool built around Marks: living gradients that make everything you design look like yours.
See our profile