画像テキスト追加ツール

ミームのキャプションから引用カード、応援バナー、商品タグまで、画像上のテキストは多くのSNSコンテンツの作り方そのものです。写真をアップロードし、それぞれ独立したフォント・色・位置を持つ1つ以上のテキストレイヤーを追加すると、このツールがフル解像度で結果をレンダリングします。任意でアウトライン、影、背景ピル、四隅へのテキスト揃えも付けられます。

画像にテキストを追加する方法

  1. 1

    画像をアップロード

    JPG、PNG、WebP。

  2. 2

    テキストレイヤーを追加

    テキストを入力し、ドラッグで配置、角のハンドルでサイズ変更します。

  3. 3

    スタイルを設定

    フォント(システムまたはGoogle Fonts)、サイズ、色、アウトライン、ドロップシャドウを選びます。

  4. 4

    レイヤーを追加

    複数のテキストボックスを重ねて、複数行のミームやキャプション付き写真を作れます。

  5. 5

    エクスポート

    ソースのフル解像度で画像に焼き込みます。

画像上のテキストのデザインルール

どんな写真でも読めるテキスト

背景がにぎやかなときにテキストを読みやすく保つ3つの手法。

  1. 強いアウトライン:白文字に2〜3 pxの黒いアウトラインを付ければ、どんな写真の上でも生き残ります。
  2. 塗りつぶしの背景ピル:テキストの背後に矩形または角丸矩形を不透明度60〜80%で置きます。
  3. 局所的な彩度低下:テキストの背後だけに、ぼかしたエッジの暗いパッチを当てます。

ミームの形式

形式 テキストの配置 標準的なフォント
上下ミーム 上下に黒縁取りの白文字 Impact、太字サンセリフ
引用カード 中央揃え、大きめ、セリフまたはディスプレイ体 Playfair、Merriweather
Instagramストーリーのキャプション 下部にピル状の背景 システムのサンセリフ
LinkedInカルーセル 左上、すっきりしたサンセリフ Inter、Helvetica
Twitterスクリーンショットのオーバーレイ 中央揃えでさりげない影 皮肉にはセリフ、ストレートにはサンセリフ

フォントの入手元

  • システムフォント:読み込み時間ゼロで、確実にレンダリングされます。
  • Google Fonts:大規模なライブラリで、非同期に読み込まれます。
  • カスタムWOFF2のアップロード:ブランド固有のタイポグラフィ向け。

構図に余白を持たせる

  • 画像のあらゆる部分にテキストを置かないでください。
  • 画像の端からテキストの周囲に最低10%の余白を取ってください。
  • 正方形のSNS投稿でも、テキストの配置に「三分割法」が当てはまります。

エクスポートのサイズ

ほとんどのSNSは画像を再エンコードします。最終表示サイズの2倍でエクスポートし、プラットフォーム側で縮小させると、目標サイズちょうどでアップロードするより鮮明な結果になります。

よくある質問

はい。WOFF、WOFF2、TTFファイルをアップロードすると、現在のセッションで登録されます。ブランド固有のフォントもすぐ使え、ブラウザの外には何もアップロードされません。

太いアウトライン(白文字に2〜3 pxの黒)と柔らかいドロップシャドウを組み合わせるか、半透明の矩形の中にテキストを置きます。必ず実際の表示サイズで確認してください。拡大すると問題なく見えるテキストも、サムネイルサイズではにぎやかな背景に埋もれて消えることがあります。

はい。システムのカラー絵文字フォントを使います。レンダリングされる絵文字はお使いのOSのバージョンに見えますが、エクスポート画像にはグリフが焼き込まれるため、どのビューアでも同じに表示されます。

はい。各テキストレイヤーは独立した回転とせん断(スキュー)を持ちます。斜めの「セール」バッジや、縦のサイドパネルのラベルに便利です。

関連ツール

このツールは他の言語でも利用できます