画像を切り抜く

なぜ正方形にするのか

Slack・Discord・Teams のカスタム絵文字は、いずれも正方形が前提です。 横長や縦長の画像をそのままアップロードすると、 アプリ側で自動的に切り取られるか、余白が足されて表示されます。どこが切り取られるかは選べません。 大事な部分が切れてしまうこともあります。

先に自分で正方形に切り抜いておけば、 何を残して何を捨てるかを自分で決められます。 これがこのツールの役割です。

使い方

1. 画像を置きます。処理はブラウザの中だけで行われます。
2. 「切り抜きの大きさ」で、どれだけ寄るかを決めます。 100% で短辺いっぱい、小さくするほど拡大されます。
3. 「よこ位置」「たて位置」で、切り抜く場所を動かします。
4. 長辺のサイズを選ぶと、切り抜きと同時に縮小もできます。
5. 形式を選んでダウンロードします。

絵文字にするなら「寄りすぎ」でちょうどいい

絵文字は 22px 前後にしか表示されません。 128px の画面で「ちょうどいい」と思った構図は、 実際にはたいてい引きすぎです。

顔なら顔だけ、物なら物だけを画面いっぱいに入れてください。 周囲の状況を残したくなる気持ちは分かりますが、 22px では何も見えません。思い切って寄るのが正解です。

Slack 絵文字メーカーは 被写体の位置を自動で推定して切り抜きを決めるので、 絵文字を作るのが目的ならそちらのほうが手数が少なくて済みます。 このページは「切り抜いた画像そのものが欲しい」場合や、 自分で細かく構図を決めたい場合に使ってください。

切り抜きと透過

このツールは矩形（正方形）の切り抜きだけを行います。 人物の形に沿って切り抜くような処理はしません。 背景を透明にしたい場合は、Slack 絵文字メーカーの 「単色の背景を透過にする」をお使いください。 白や単色の背景であれば、色を判定して透明にできます。

複雑な背景の写真から人物だけを切り抜く場合は、 画像編集ソフトか、専用の背景除去サービスをお使いください。 切り抜き済みの PNG を用意すれば、 あとはこのサイトのツールで規格に収められます。

よくある失敗

切り抜いたら容量が増えた

形式が変わっている可能性があります。 JPEG の写真を PNG で書き出すと、写真は色数が多いため容量が増えます。 写真なら JPEG のままにしてください。

思った位置で切り抜けない

「切り抜きの大きさ」を小さくしてから位置を動かすと、細かく合わせられます。 大きさが 100% のままだと、短辺の方向には動かせません。

縦長の画像で顔が切れる

初期状態では中央が切り抜かれます。 「たて位置」を 0% 側に動かすと上のほうが残ります。 人物の写真では、顔が上のほうにあることが多いので、 30% 前後に置くとうまくいきます。

画像はサーバーに送信しません

読み込みから書き出しまで、すべてブラウザの中で処理しています。 画像がネットワークに出ることはないので、 社内資料や個人の写真でも安心してお使いいただけます。

切り抜きの位置を決めるコツ

初期状態では中央が切り抜かれます。 人物の写真の場合、顔は画面の上のほうにあることが多いので、 「たて位置」を 30% 前後に置くとうまく収まります。

「切り抜きの大きさ」は、100% で短辺いっぱいです。 これを下げるほど拡大され、位置のスライダーで動かせる範囲も広がります。大きさを先に決めてから位置を合わせると、迷わずに済みます。

絵文字にするなら、思い切って 40〜60% まで寄ってください。 128px の画面で「ちょうどいい」と感じる構図は、 22px ではたいてい引きすぎです。Slack 絵文字メーカーの実寸プレビューで確かめると、 どれくらい寄るべきかの感覚がつかめます。

切り抜きと縮小の順番

切り抜いてから縮小するのが正しい順番です。 先に縮小すると、切り抜いたときにさらに小さくなって解像度が足りなくなります。 このツールは切り抜きと縮小を同時に行うので、 順番を気にする必要はありません。

ただし、元の画像は大きいまま残しておいてください。 切り抜きをやり直したくなったとき、 縮小済みのファイルからでは元に戻せません。