ZorroSVG

画像 ＞ SVG

PNG or GIF → SVG

　状態:- 　閲覧数:2,353 　投稿日:2015-08-23 　更新日:2015-08-26
実際に使用してみた感想
・元画像の再現率が高い

SVG変換ツール全般について


ソフト毎に様々な方針が存在
・変換エフェクトに拘るもの、軽量化に特化するもの、など

このオンラインツールの特徴
・元画像の再現率が高いSVGも生成可能

最適な画質/サイズ比を見つけるために圧縮品質をライブで変更可能
・より元画像へ近くするか、サイズを落とすか、をスライダーでリアルタイムで設定＆確認可能

疑問


本当のSVG形式？
・SVG形式には相違ないが、中身は「Base64エンコードされたjpeg画像」を埋め込んでいるだけじゃないの？
・いわゆる「Data URI scheme」を、表面だけSVGでラッピングしただけ？

作成SVG画像コード例
<svg xmlns="http://www.w3.org/2000/svg" width="854" height="854" viewBox="0 0 854 854" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter id="a"><feOffset dy="-854" in="SourceGraphic" result="b"></feOffset><feColorMatrix in="b" result="b" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0"></feColorMatrix><feComposite in="SourceGraphic" in2="b" operator="in"></feComposite></filter></defs><image width="100%" height="200%" xmlns:A="http://www.w3.org/1999/xlink" A:href="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAA … 以下略



・ZorroSVG - Put a Mask on it

P2VJ

PicSvg



類似度ページランキング
順位 ページタイトル抜粋 ％
1 ZorroSVG 75
2 SVG 55
3 SVGハマった点 38
4 SVG表示サイズ 38
5 SVGイラスト素材 35
6 SVGアニメーション 33
7 Group Tabs 33
8 RGB ⇔ HSV 32
9 SVGアイコンを探す旅 32
10 「Illustrator」は「SVG」 出力可能 30
11 「Fireworks CS3」は「SVG」 出力不可 29
12 Potrace 27
13 Bookmark Sentry 26
14 Sleipnir 25
15 「SRWare Iron」を検討 25
16 FotoSketcher 3.10 24
17 HSV → RGB 計算方式の違い 24
18 FotoSketcher 3.40 24
19 SVGの色指定は、「枠線 stroke」と「内部 fill」の2種類 24
20 Modernizr 24
2026/2/28 4:50 更新
週間人気ページランキング ／ 2-20 → 2-26
順位 ページタイトル抜粋 アクセス数
1 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 18
2 「bgcolor」「background-color」「background」の違い | CSS 5
2 RGBの種類 ／ ビットカラー | RGB(色) 5
2 RGB ⇔ Lab | 色変換(色) 5
3 「属性」「プロパティ」「アトリビュート」の違い | CSS 4
4 画像縦横比の問題 | 画像 3
4 効果を打ち消すスタイルシート | CSS 3
4 色モデルイメージ図 | 色変換(色) 3
4 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 3
4 キャラクター無料作成ジェネレーター ／ FLASH ／ オンラインサービス | イラスト参考(デザイン) 3
4 「東京都」のカラーコード取得は難しい | カラーコード(色) 3
5 画面キャプチャ 2022 年 | Chrome 拡張機能 2
5 CSSだけで、任意の要素に配置した画像を画面一杯に表示することは、基本的には出来ない。「img src」「背景画像」「div要素」何れの場合でも。可能なのは、特殊な要件が重なった場合だけ | CSS 2
5 フォントアイコン表示不具合の原因は重複読込＋α | フォント 2
5 「Font Awesome」で「ダウンロードしたSVGを直接表示」する方法 2
5 Chrome ブラウザで画像の DataURI を取得 | Google Chrome(ブラウザ) 2
5 FontAwesomeでアイコンが□（四角）になって表示されない　Forbidden　 | Font Awesome(フォント) 2
5 ｢レイヤー」＋「レイヤー効果」をコピーして新規psdにペースト | Photoshop 2
5 「Fireworks」後継として「Gravit Designer」を使用していくことを一度は決定したが、2022 年時点で入手可能なソフトウェアは日本語入力未対応　 | Gravit Designer(ソフトウェア) 2
5 GIMPで「レイヤーとして開く」を選択した画像、の位置情報(x,y)を表示させる方法が分からない | GIMP 系(ソフトウェア) 2
2026/2/27 5:05 更新