# Storlek på Twitter-header: X-header och bildstorlekar för inlägg

[Canonical HTML page](https://gradiently.design/sv/guide/x-header-size)

X-headern är bred, låg och delvis täckt av din profilbild. Här är storleken, ytan du ska hålla fri, idéer för vad du lägger på den och rätt storlekar för bilder i inlägg.

## The short version

- Storleken på Twitter-headern på X är 1500×500 pixlar, i proportionen 3:1.
- Profilbilden täcker nedre vänstra delen av headern, så håll text och logotyper borta från det hörnet.
- Olika skärmar visar något olika beskärningar av headern, så placera viktigt innehåll i mittbandet, bort från övre och nedre kanten.
- Bilder i X-inlägg fungerar bäst i 1600×900 för liggande (16:9) eller 1080×1350 för stående (4:5).
- En header fungerar bäst som en enkel, igenkännbar bakgrund med en kort rad, inte en överfull affisch.

**Storleken på Twitter-headern** på X är 1500×500 pixlar, en bred banner i 3:1. Din profilbild ligger över dess nedre vänstra hörn, och olika skärmar beskär lite i över- och underkant, så placera text och logotyper i mitten och till höger på bannern, bort från kanterna. För bilder i inlägg använder du 1600×900 för liggande eller 1080×1350 för stående.

## Bildstorlekar på X i korthet

| Format | Storlek (px) | Proportion | Anmärkningar |
| --- | --- | --- | --- |
| Header | 1500×500 | 3:1 | Profilbilden täcker nedre vänstra hörnet |
| Inläggsbild, liggande | 1600×900 | 16:9 | Den klassiska formen i tidslinjen |
| Inläggsbild, stående | 1080×1350 | 4:5 | Tar mer höjd i tidslinjen på telefoner |
| Bild till länkkort | 1200×630 | 1,91:1 | Hämtas från den länkade sidans Open Graph-bild |

Rekommenderade uppladdningsstorlekar för X. Bilden till länkkortet anges på din webbplats och laddas inte upp till X; se [storlek på Open Graph-bild](https://gradiently.design/sv/guide/open-graph-image-size).

- Header 3:1: 1500 × 500
- Inlägg 16:9: 1600 × 900
- Stående inlägg 4:5: 1080 × 1350

De tre formerna på X ritade i skala. Headern är den enda där något ligger ovanpå din design.

## Där profilbilden täcker headern

Din runda profilbild ligger över nedre vänstra delen av headern både på telefoner och datorer. Allt du lägger där, som en logotyp, ett datum eller slutet på en rubrik, döljs eller ser trångt ut mot bildens kant. Dessutom visas headern inte i exakt 3:1 på varje skärm, så en remsa upptill och nedtill kan beskäras.

### Undvik

- Text eller logotyp i nedre vänstra kvarten
- Ord som ligger nära över- eller underkanten
- Liten text som bara går att läsa på en stor skärm
- Ett rörigt foto som kämpar mot profilbilden

### Gör så här

- Ord i mitten eller högra halvan, i mittbandet
- Gott om luft ovanför och under all text
- En kort rad, tillräckligt stor för att läsas på telefon
- En lugn yta där profilbilden hamnar

Ett användbart knep är att låta själva bakgrunden lämna plats för bilden. Lägg den mörkaste eller lugnaste delen av gradienten nere till vänster, där profilbilden sitter, och låt färgen öppna sig mot höger, där dina ord hamnar.

- Mörk under bilden, rosa åt höger: `linear-gradient(60deg, #0d0d1a 0%, #0d0d1a 25%, #3b2a8c 60%, #f08fb2 100%)`
- Varm glöd till höger, lugn till vänster: `radial-gradient(circle at 80% 40%, #ffb17a 0%, #c2410c 35%, #1c0a05 80%)`
- Djupgrön till mint: `linear-gradient(60deg, #0b1f1a 0%, #0b1f1a 20%, #14746f 60%, #b8f2e6 100%)`

Headergradienter byggda kring profilbilden. Vid 60 grader ligger den första färgen nere till vänster och blandningen rör sig mot övre högra hörnet.

## Vad du lägger på en X-header

En header syns varje gång någon besöker din profil, ofta direkt efter att ha läst ett av dina inlägg. Den ska bekräfta vem du är med en blick, inte berätta hela din historia. Det här fungerar bra.

- **Ditt uttryck, och inget mer.** En särpräglad bakgrund i varumärkets färger eller material är ofta den starkaste headern.
- **En rad.** Vad du gör eller vad du arbetar med, med några få ord.
- **Något aktuellt.** En lansering, en bok, ett datum för ett evenemang, som du byter när det är över.
- **Ett konsekvent par.** Samma uttryck som din LinkedIn-banner och webbplats, så att folk känner igen dig mellan plattformar. Se [storlek på LinkedIn-banner](https://gradiently.design/sv/guide/linkedin-banner-size).

1. **Börja i 1500×500** Ställ in arbetsytan i exakt rätt storlek. Att designa i en annan form och beskära senare är så logotyper hamnar under profilbilden.
2. **Markera förbjudna hörnet** Blockera nedre vänstra kvarten som en påminnelse om att bilden täcker den.
3. **Lägg bakgrunden först** Välj en bakgrund som är lugn där profilbilden hamnar och mer spännande där blicken vandrar.
4. **Lägg till en rad, till höger om mitten** Håll den kort och sätt den stor, med fri yta ovanför och under.
5. **Kontrollera på telefon** Ladda upp den och titta på din profil på en telefon och en laptop. Justera allt som sitter för nära en kant.

En bred X-header på 1500 gånger 500 med en kort textrad till höger om mitten över en gradient

En header med en rad, satt till höger om mitten i mittbandet, som lämnar nedre vänstra hörnet lugnt för profilbilden.

## Bildstorlekar för X-inlägg

För bilder i inlägg väljer du form efter vad du delar. Liggande 1600×900 passar skärmbilder, diagram och breda foton och matchar den ram många andra plattformar använder. Stående 1080×1350 tar mer plats i tidslinjen på telefoner, vilket ger ett designat inlägg mer närvaro. [Design av Twitter-bilder](https://gradiently.design/sv/guide/x-post-image-design) går djupare in på layout.

En liggande X-inläggsbild med titeln Tre saker vi släppte, upplagd i två kolumner

Liggande 1600×900: bra för breda layouter och innehåll sida vid sida.

Samma inlägg som en stående bild, med rubriken staplad vertikalt

Stående 1080×1350: mer höjd i tidslinjen, bättre för en enda stark rubrik.

Exportera headers och inläggsbilder som PNG när de innehåller text eller gradienter, i sRGB, i exakt de storlekar som anges ovan. X komprimerar om uppladdningar, och mjuka gradienter visar det först som bandning; lite korn hjälper. Hela listan över plattformarnas storlekar finns i [bildstorlekar för sociala medier](https://gradiently.design/sv/guide/social-media-image-sizes).

## FAQ

### Vilken storlek har Twitter-headern?

1500×500 pixlar, i proportionen 3:1, på X.

### Varför ser min X-header beskuren ut?

X visar headern i något olika proportioner på olika skärmar och beskär lite upptill och nedtill, och profilbilden täcker nedre vänstra hörnet. Håll viktigt innehåll i mittbandet och borta från det hörnet.

### Vilken storlek ska bilder i X-inlägg ha?

1600×900 för liggande (16:9) eller 1080×1350 för stående (4:5).

### Var ska texten sitta på en X-header?

I mitten eller högra halvan av bannern, i mittbandet, med luft ovanför och under. Håll den borta från nedre vänstra hörnet, där profilbilden sitter.

### Vilken filtyp ska en X-header ha?

PNG för headers med text, enfärgade ytor eller gradienter, och en JPEG av hög kvalitet för fotografier, båda i färgprofilen sRGB.

### Är X-headern lika stor som en LinkedIn-banner?

Nej. X-headern är 1500×500 (3:1), medan en LinkedIn-profilbanner är 1584×396 (4:1), så var och en behöver sin egen layout.
