mcpField
S
social-media-image-sizes

social-media-image-sizes

github.com/branding5クリエイティブ・メディア71.8k 回インストール26 週間前に更新
リポジトリ

social-media-image-sizes について

Social Media Image Sizes は、9つのソーシャルプラットフォームの仕様に合わせて画像を確認・リサイズするスキルです。適合度を順位付けし、各仕様に応じたリサイズコマンドを示します。

主な機能

  1. 01プラットフォーム仕様に照らした画像確認
  2. 02最適から小さすぎるまで適合度を表示
  3. 03プラットフォームや適合度で絞り込み
  4. 04cover または contain でリサイズ
  5. 05利用可能な画像仕様の一覧表示

活用シーン

  1. 01元画像に適したSNS形式の確認
  2. 02特定のプラットフォーム掲載用画像の準備
  3. 03指定したクロップや背景で画像をリサイズ
  4. 04カルーセル画像のアスペクト比の確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/branding5/social-media-image-sizes --skill social-media-image-sizes

インストール後、Claude Code で/social-media-image-sizesを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

AGENTS.md
LICENSE
README.md
package.json
.gitignore
references/
instagram.md
best-practices.md
facebook.md
linkedin.md
pinterest.md
threads.md
tiktok.md
snapchat.md
youtube.md
x-twitter.md
scripts/
check.js
platform-data.js
resize.js

詳細

ソーシャルメディア画像サイズ

9つのプラットフォーム／60以上の仕様に対応した画像の確認とサイズ変更を行います。スクリプトは、branding5.com/tools/social-media-cheat-sheet のロジックを再現しています。

セットアップ

インストール後に一度実行します。

cd <skill-dir>
npm install

画像を確認する

node scripts/check.js photo.jpg

一致度の高い順に、最適 → 近い → 使用可能 → 小さすぎる、という一覧を出力します。最適以外の各候補には、インラインの node scripts/resize.js コマンドが付いています。

プラットフォームまたは一致度で絞り込みます。

node scripts/check.js photo.jpg --platform instagram
node scripts/check.js photo.jpg --filter perfect
node scripts/check.js photo.jpg --filter usable

プラットフォームのスラッグ：instagram facebook twitter linkedin tiktok youtube pinterest snapchat threads

画像のサイズを変更する

node scripts/resize.js photo.jpg "Instagram Portrait Post"
# → photo-instagram-portrait-post.jpg  (1080×1350 px)

node scripts/resize.js photo.jpg "YouTube Custom Thumbnail"
# → photo-youtube-custom-thumbnail.jpg  (1280×720 px)

デフォルトのフィット方法は cover（中央で切り抜き）です。代わりにレターボックス表示するには、--fit contain を使います。

node scripts/resize.js photo.jpg "LinkedIn Background Photo" --fit contain --bg f0f0f0
node scripts/resize.js photo.jpg "Instagram Portrait Post" --out ./exports/ig.jpg

利用可能なすべての仕様名を一覧表示します。

node scripts/resize.js photo.jpg --list

ワークフロー

  1. check.js を実行して、指定した画像がすでにどの仕様に一致するかを確認します
  2. 出力から、提案された resize.js コマンドをコピーします
  3. コマンドを実行します。デフォルトでは、出力ファイルは元の画像と同じ場所に保存されます

注意点

  • Sharp にはネイティブバイナリが必要です。 初回の npm install で、使用しているプラットフォーム用のビルド済みバイナリがダウンロードされます。プロキシ経由でのインストールに失敗した場合は、SHARP_IGNORE_GLOBAL_LIBVIPS=1 を設定して再試行してください。
  • Instagram のカルーセルでは、すべてのスライドのアスペクト比を揃える必要があります。 最初の画像でカルーセル全体の比率が決まります。最初の画像だけでなく、すべてのスライドを確認してください。
  • Facebook のカバー写真には2つのセーフゾーンがあります。 デスクトップでは 820×312、モバイルでは 640×360 に切り抜かれて表示されます。重要なコンテンツは中央の 640×312 に収めてください。
  • YouTube バナーのセーフエリアは、画像全体よりかなり小さいサイズです。 仕様は 2560×1440 ですが、すべてのデバイスで確実に表示されるのは中央の 1546×423 のみです。check.js は画像全体のサイズを判定します。重要なコンテンツはセーフエリア内に収めてください。
  • --fit cover は中央で切り抜きます。 被写体が中央にない場合は、--out で保存してから手動で切り抜くか、サイズ変更の前に画像エディターを使ってください。

参考資料

プラットフォームごとの仕様全体（特定のプラットフォームの詳細が必要な場合に読み込んでください）：

  • references/instagram.md — プロフィール、フィード、ストーリーズ、リール、カルーセル、広告
  • references/facebook.md — プロフィール、カバー、フィード、ストーリーズ、イベント、広告
  • references/x-twitter.md — プロフィール、ヘッダー、投稿、広告
  • references/linkedin.md — プロフィール、カバー、フィード、記事、広告
  • references/tiktok.md — プロフィール、動画、広告
  • references/youtube.md — チャンネルアート、動画、サムネイル、ショート、広告
  • references/pinterest.md — プロフィール、ピン、アイデアピン、広告
  • references/snapchat.md — スナップ、スポットライト、ストーリーズ、広告、フィルター
  • references/threads.md — プロフィール、投稿
  • references/best-practices.md — 形式、圧縮、セーフゾーン、アクセシビリティ

全プラットフォームをまとめた完全版の参考資料：AGENTS.md

これらのサイズに合わせたブランドイメージを生成したいですか？ Branding5 は、ブランドキットと AI を組み合わせて、各プラットフォームに合わせたサイズのソーシャルコンテンツを作成します。

コメント

Markdown 対応