無料写真にテキストを追加

実例

「サンプルを試す」を押します。写真 sample-image.png(1200 × 800)が開き、下部に「ここにテキストを入力」というテキストレイヤーが1つ、「テキストサイズ: 86px」で表示されます。「テキスト」ボックスを Sunset over Lisbon に変え、「ワンタップスタイル」の「ミーム」を押します。フォントがコンデンスになり、10% の黒い輪郭が付き、テキストサイズは 135px に上がります。「書き出しサイズ」ボタンの横のサイズは 1200 × 800 で、「1080 px」を押すと 1080 × 720 に変わります。「4:5 縦長」を押すと 1080 × 1350 になります。写真は中央から切り抜かれ、「ボックスの幅」は 90% のままで、テキストは 109px で2行の「Sunset over」と「Lisbon」に収まり直します。「形式」は JPEG、「画質: 90」のまま「ダウンロード」を押します。ファイル名は sample-image_text.jpg です。

使用する設定と制限事項

• テキストごとに、1つのレイヤーを使いましょう。 別のレイヤーを追加するには「+ テキストを追加」を押します。最初の空いている行に、中央から始めて配置され、選択中のレイヤーのフォントがコピーされます。初期サイズは写真の幅の16分の1で、サンプルでは 75px です。「テキスト」ボックスで Enter キーを押すと改行します。レイヤーが2つになると、「レイヤー(上から下へ)」という一覧が現れ、それぞれに「前に持ってくる」「後ろに送る」「レイヤーを複製」「レイヤーを削除」があります。「選択したものを削除」は現在のレイヤーを削除します。他のレイヤーの陰に隠れたレイヤーを選ぶには、一覧の名前をクリックします。
• テキストは、ドラッグまたはキーボードで動かしましょう。 写真上のテキストをドラッグします。中央付近では、写真の幅の1.2%以内でスナップし、ピンクのガイド線が現れます。ガイドが保存されることはありません。プレビューを一度クリックしてフォーカスを移し、矢印キーを使います。1回押すごとにテキストは写真の幅の1/200(最低 2 px、サンプルでは 6 px)ずつ動き、Shift を押すと5倍の幅になります。Delete キーでレイヤーを削除します。「元に戻す」と「やり直す」は直近の60ステップが保持されます(Ctrl+Z、Ctrl+Shift+Z、Ctrl+Y)。スマートフォンでは、設定をスクロールしている間、プレビューが上部に固定されます。
• 写真が細かくても、読みやすいテキストにしましょう。 「アウトライン」と「シャドウ」は、レイヤーを作成した時点でオンです。輪郭は黒でテキストサイズの 8%、太さは 1〜25 の範囲で設定できます。「背景」は、テキストの後ろに角丸のバーを、独自の色で置きます。「写真を暗くする」は写真全体を 0〜80% 暗くし、「不透明度」は 5〜100% の範囲です。「ワンタップスタイル」は、複数のオプションをまとめて設定します。「ミーム」は、10% の黒い輪郭付きのコンデンスです。「字幕バー」は、不透明度 65% の黒いバーで輪郭なしです。「引用カード」は、シャドウ付きのセリフで、写真を少なくとも 40% 暗くします。
• サイズは「文字を合わせる」に任せましょう。 「テキストサイズ」は 12〜400px です。「文字を合わせる」は、単語が途中で切れず、テキストの高さが写真の高さの半分以下になる最大のサイズを選びます。サンプルの最初のテキストでは 181px です。最初のテキストとワンタップスタイルは自動モードで始まり、入力するにつれて、写真の高さの30%以内に収まるよう縮小されます。これは「テキストサイズ」スライダーを動かすまで続きます。「ボックスの幅」(写真の幅の 10〜100%、初期値 90)は、行が折り返される位置を決めます。ボックスより幅の広い単語は文字の間で分割され、中国語のようにスペースのないテキストも同じように折り返されます。
• 言語に合ったフォントを選びましょう。 フォントは、サンセリフ、セリフ、筆記体、コンデンス、「アラビア語 / ペルシア語」です。オープンライセンスの書体で、このサイトから配信され、初回の使用時に読み込まれるため、最初の変更には少し時間がかかることがあります。アラビア語の書体は、テキストにアラビア文字が含まれると自動的に追加され、ページの言語が右から左に書く言語であれば最初から選択されています。テキストの方向は、最初に入力した文字に従います。「文字間隔」はテキストサイズに対して -5〜30% で、古い Safari では無視されます。「回転」は -180〜180 度です。
• 書き出しサイズと形式を選びましょう。 「書き出しサイズ」には「元のサイズ」「1080 px」「4:5 縦長」があり、結果のサイズがボタンの横に表示されます。1辺が 4096 px を超える写真は、読み込み時に 4096 に縮小されるため、「元のサイズ」でもそれを超えることはありません。「1080 px」は長辺を 1080 に合わせ、拡大はしません。「4:5 縦長」は中央から切り抜いて幅を 1080 にするため、小さな写真は拡大されます。800 × 600 は 1080 × 1350 になります。「形式」には JPEG、PNG、お使いのブラウザーが保存できる場合は WebP があります。「画質」は 50〜100 で、PNG では非表示です。ブラウザーがファイルの共有に対応していれば、「共有」ボタンが表示されます。

よくある問題とその解決方法

「この画像を読み込めませんでした。サポートされていないフォーマットの可能性があります。」と表示されます。

ブラウザーがファイルを画像としてデコードできませんでした。ドロップ領域はどの画像形式も受け付け、iPhone の HEIC 写真は自動で変換しますが、ブラウザーがそのファイルを読み取れる必要があります。破損したファイル、ダウンロードが途中のファイル、一般的でない形式では、ここで失敗します。別のプログラムでファイルを開き、JPEG または PNG として保存し直してから追加してください。0 バイトのファイル(OneDrive や iCloud のプレースホルダーであることが多い)は、もっと早い段階で専用のメッセージで断られます。

「画像をエクスポートできませんでした。もう一度お試しください。」と表示されます。

選んだサイズと形式で「ダウンロード」または「共有」を押したとき、ブラウザーが画像データを返しませんでした。テキストレイヤーはそのまま残っています。「書き出しサイズ」で「1080 px」を選ぶか、「形式」を JPEG に切り替えて、もう一度ボタンを押してください。1辺が 4096 px を超える写真は、すでに読み込み時に縮小されているので、次に試すのは、より小さな書き出しサイズです。

「4:5 縦長」を押したあとに、テキストが見当たりません。

このオプションは、写真を中央から切り抜いて、4:5 の部分だけを残します。1200 × 800 のサンプルでは、横幅の中央の 640 px だけが残ります。その範囲の外にあるレイヤーは移動されないため、プレビューと保存されるファイルの外に出てしまいます。調整されるのは、ボックスの幅と自動サイズだけです。テキストを表示範囲にドラッグして戻すか、「元のサイズ」に戻してください。プレビューには、保存されるものと同じ切り抜きが表示されます。

PNG の透明な部分が、保存したファイルで黒くなります。

写真は背景の塗りつぶしがないキャンバスに描かれ、初期値の「形式」である JPEG には透明がないため、透明なピクセルは黒として書き込まれます。透けた部分を残すには「形式」で PNG を選び、通常の写真には JPEG を使い続けてください。

写真をクリックしても、テキストが選択されません。

クリックでレイヤーが選択されるのは、テキストのボックスの内側、またはその左右 20 px、上下 16 px の余白(写真のピクセル単位)に入った場合だけです。大きな写真を小さく表示していると、その余白は画面上ではわずかなピクセルしかないため、文字の上を狙ってください。レイヤーが重なっている場合は、一番上のものが優先されます。レイヤーが2つ以上あれば、「レイヤー(上から下へ)」の一覧から選ぶこともできます。

比較

スマートフォンの写真アプリやデスクトップ用の編集ソフトなら、フィルター、ステッカー、自由なトリミング、プロジェクトの保存など、さらに多くのことができます。このツールが行うのは、テキストレイヤーと、「写真を暗くする」、3種類の書き出しサイズだけです。一度に扱える写真は1枚で、すでに画像の一部になっているテキストは編集できず、プロジェクトも保存されません。ページを再読み込みすると、最初からやり直しになります。写真はブラウザー内で読み込まれ、描画され、アップロードされません。保存されるファイルはピクセルから描画されるため、元のファイルのカメラ情報は含まれません。キャプション、ミーム、引用カードに使い、それ以上のことには本格的な編集ソフトを使ってください。