画像をSVGに(ベクター化)
Image to SVG
ビットマップを、写真よりロゴや線画に向いた調整でSVGのパスに起こします。
トレースは画像をいくつかの平坦な色に減色し、各領域の境界をたどってパスにします。ロゴや印章、線画には効きます。写真では、元より大きくて見た目の悪い、何千本ものパスができます。
ロゴか線画を置いてください
平坦な色でできた絵はきれいにトレースできます。写真はそうなりません。
使い方
平坦な色の素材を置きます
スキャンしたロゴ、署名、PNGしか残っていないアイコン——ベクターが最初からなかったのではなく、失われた場合です。
色数を決めます
白地に黒のマークなら2つ。素材が本当にそれ以上の平坦な色を持っているときだけ増やします。1色増えるごとに、パスの層が1つ増えます。
最小領域の面積を上げて粒を落とします
スキャンには、色の違う孤立したピクセルがそこら中にあります。この面積を下回る領域は、パスにならずに周りへ吸収されます。
パスの数を確かめます
トレースしたロゴなら数十本です。300を超えるとページがそう書きます。素材ではなく写真であることの、それが徴だからです。
よくある質問
写真のトレースが、なぜこんなにひどいのですか
領域がないからです。写真は連続した階調なので、減色すると、なかったはずの境界が作られ、その一つひとつがパスになります。出力はJPEGより大きく、しかも不正確です。
トレースしたSVGは元と正確に一致しますか
しません。境界はピクセルの格子の上でたどるので、元でなめらかだった曲線は、わずかに段の付いた多数のセグメントのパスとして返ってきます。復元ではなく再構成です。
結果はどう使えばいいですか
SVG最適化に通してください。トレースしたファイルは必要以上の精度を持っています。そして、ずっと使う素材にするなら、エディタでパスを整える手間は見込んでおいてください。
ここから渡せます
SVGパス編集
SVG Path Editor
パスデータを絶対・相対コマンドで書き換え、移動・拡大・回転・向きの反転を加え、バウンディングボックスとプレビューを表示します。
PNG圧縮
PNG Compressor
パレットを量子化してdeflateストリームを書き直し、寸法を変えずにPNGを軽くします。
JPEG圧縮
JPEG Compressor
指定した画質でJPEGを再エンコードし、前後の容量と差分をその場で見せます。
WebP変換
WebP Converter
画像をWebPに、またはWebPから他の形式に変換し、画質の調整と可逆モードを選べます。
次の一手
このツールが出したものをそのまま受け取れる道具です。
SVG最適化
SVG Optimiser
編集ソフトの残骸を取り除き、変換をまとめ、座標の桁を丸めて、描画結果を並べて比べます。
SVGパス編集
SVG Path Editor
パスデータを絶対・相対コマンドで書き換え、移動・拡大・回転・向きの反転を加え、バウンディングボックスとプレビューを表示します。
SVGをPNGに変換
SVG to PNG
SVGを好きな倍率でPNG・JPEG・WebPに描き出し、背景は透明のままにも塗りつぶしにもできます。
背景透過(切り抜き)
Background Remover
平坦な背景や単色の背景をOKLabでキーイングして透過PNGにし、縁はブラシで直せます。
EXIF情報の削除
EXIF Remover
画素には手を触れずに、カメラ・GPS・編集履歴のメタデータだけを写真から消します。
ファビコン生成
Favicon Generator
ICO・各サイズのPNG・Appleタッチアイコン・ウェブマニフェストを一式で作り、貼り付けるHTMLも添えます。