Twitterヘッダー（1500×500）
Xのヘッダーは3:1の比率で1500×500ピクセルです。プロフィール写真が左下角に重なり、モバイルではbioブロックが下端に侵入するため、このページでは切り抜き中に両方を描画し、正確なフレームをローカルでエクスポートします。
PNG、JPG、WebP、GIFをドロップ
ページのどこにでもドロップできます · ファイルを選択 · 100 MB
対応形式： PNG, JPG, JPEG, WebP, GIF, AVIF
Twitterヘッダー（1500×500）とは
Xのヘッダーはプロフィールの上部に配置される、3:1の帯状画像で、1500×500ピクセルです。ソーシャル画像の中で真正に横長な比率の数少ないものの一つであり、プラットフォームのインターフェースがそれを大幅に削る数少ないケースの一つでもあります。
プロフィール写真は円形で左下角に重なります。電話ではプロフィールカードがヘッダーの下部にスライドして重なるため、使用可能な帯は500ピクセルという表示より短くなります。これらの重なりにより、左下四分の一の領域は信頼できません。
このページでは1500×500を保持し、アバターサークルを描画し、プロフィールブロックが覆う帯を表示し、正確なファイルをエクスポートします。すべてがお使いのブラウザ内で行われます。
Blueskyは同じ3:1の形状をより大きなサイズで使用するため、Blueskyバナーのリサイズツールここで行った切り抜きを再利用できます。
エクスポートしたファイルがアップロード制限より大きい場合、画像圧縮ツール指定したサイズに圧縮します。
ヘッダーと周囲の画像
プロフィールを構成する3つの画像のうち、この帯状の画像は1つです。
| 画像 | サイズ | 形状 | 備考 |
|---|---|---|---|
| ヘッダー | 1500 × 500 | 3:1 | プロフィールの上部の後ろに配置 |
| プロフィール写真 | 400 × 400 | 円形 | ヘッダーの左下角に重なる |
| リンクプレビューカード | 1200 × 628 | 1.91:1 | 投稿したリンク用、プロフィール用ではない |
インターフェースが覆う部分
2つの重なりがあり、モバイル用の重なりはデスクトップには存在しないため、多くの人を悩ませます。
アバターサークルはすべてのレイアウトで左下角に重なります。電話ではプロフィールカード（名前、ハンドル、bio、フォロワー数）がより高く描画され、デスクトップブラウザでは表示されるヘッダーの下部を削ります。
- 左下角：すべてのデバイスでアバターサークルが重なります。
- 下部の帯：モバイルレイアウトではプロフィールカードが重なります。
- 右上：すべての場所で確実に表示される――メッセージはここに配置してください。
- 左右の端：ヘッダーが幅いっぱいに表示されるため、狭いウィンドウでは切り取られます。
3:1の帯状画像のデザイン
3:1は広すぎるため、ほとんどの写真は中央寄せではなく意図的な切り抜きが必要です。風景写真、繰り返し模様、周囲に余白のあるワードマークなどはこの形状に適していますが、縦長の写真には適していません。
ヘッダーにテキストを配置する価値はほとんどありません。この帯は電話では数百ピクセル幅で表示され、その直下のbioにはすでにテキストが表示されており、プラットフォームが制御するフォントで常に読みやすいサイズです。
形式とファイルサイズ
写真ヘッダーにはJPEG、平面な色や文字にはPNGを使用してください。Xはアップロードを配信用に再エンコードし、独自のファイルサイズ制限を適用するため、クリーンで高品質なソースファイルが最大のものよりも優れています――すでに大幅に圧縮されたものを提供すると、アーティファクトが重なってしまいます。
よくある質問
Xのヘッダー画像のサイズは？
1500×500ピクセル、3:1の帯状です。プロフィールの上部の後ろに配置され、円形のプロフィール写真が左下角に重なります。正確にこのサイズでアップロードすると、切り抜かれずに選択した構成が保持されます。
モバイルでヘッダーの一部が隠れるのはなぜですか？
プロフィールカード（名前、ハンドル、bio、カウント）がデスクトップより電話でより高く描画され、ヘッダーの下部の帯を削るためです。プレビューではその帯が表示されるため、重要なコンテンツをその上に配置できます。
プロフィール写真はヘッダーのどこに配置されますか？
左下角にヘッダーの縁を重ねる円形で配置されます。すべてのレイアウトで描画されるため、ヘッダーの左下部分は完全に表示されることはありません。代わりにロゴとテキストは右上に配置してください。
ヘッダーに名前やハンドルを配置すべきですか？
通常は不要です。プロフィールカードのすぐ下にすでに両方が表示されており、プラットフォームが制御するフォントで常に読みやすいサイズです。帯状部分に繰り返し表示すると、読者がすでに見ているものを再表示することになります。
ヘッダーの端が切り取られるのはなぜですか？
ヘッダーはプロフィール列の幅いっぱいに表示されるため、狭いウィンドウではその幅に合わせてスケールされ、左右の端が表示範囲外になることがあります。構成を中央に保ち、外側の端はコンテンツではなくブリードとして扱ってください。
ここでヘッダーを切り抜くときにアップロードされますか？
いいえ。切り抜きとエクスポートはこのブラウザタブ内で完全に実行され、画像を受信するサーバーはこのサイトにはありません。結果は自分でXにアップロードし、このページが作業を行っている間はネットワークパネルは空のままです。