画像リサイズツール

画像ファイルの読込み方法

  1. 画像ファイルをドロップ
  2. 画像を貼り付ける
  3. 画像URLから読込む

または

貼り付けエリア、右クリックでコピーした画像を貼り付けられます。

▼キャンバス(作業エリア)

画像▼  「右クリック名前をつけて保存かボタン」から保存可能です

画像化

保存

リサイズメニュー

画像情報
2倍ボタン

リサイズ

x縦

容量

保存形式

画像リサイズツール

リサイズツールの特徴

  1. ブラウザ上で見た目のサイズを確認しながらサイズ変更が可能
  2. 背景が透明な画像も維持したままリサイズ可能
  3. リサイズ後の画像容量(kb)も表示可能。
  4. 透過画像の背景色を変更できる。(pngからjpg変換時の真っ黒な問題を解決)

リサイズメニュー

リサイズ設定に関する説明です。

画像情報

読込み画像のサイズに関する情報を表示します。

このボタンは、キャンパスを初期画像のサイズに戻します。

リサイズ

数値入力による画像サイズの変更、容量(kb)の表示が可能です。

縦横比にチェックが入っていると、画像の縦横比を保ちます。

2倍ボタン

2の倍率で拡大・縮小するボタンです。

3000px以上拡大しすぎると重くなるので気をつけて下さい。(パソコンによりますが)

画像形式

画像化ボタンで画像を作成します。JPGとPNGの2種類になります。透明情報のある画像をjpgで保存する時は色指定できます。

画像読込み方法

  1. 画像ファイルのドロップは破線の内側にドロップします。
  2. 画像の貼付けは、ストライプ線の中で貼り付けます。
  3. 外部サイトの画像URLを読み込みます。(JPG,PNG,GIF)

まとめ

ペイントより使いやすいリサイズツールが欲しいと思って作りました。大きさを確認してサイズ変更するのに便利です。HTML5のCANVASという機能を使っています。

バージョンアップ

リサイズツール2を作りました。

  1. 読み込める画像増加、画像ペーストでの読み込みの不具合改良
  2. アンチエイリアス機能、背景色機能。
  3. デザインシンプル&画像描画時の軽量化

こちらのリサイズツールでの不具合、改良点などをリサイズツール2で修正してるのでリサイズツール2を使っていただく事をお勧めします。環境によって不具合あるかもしれませんのでこちらも残しておきます。