SVG(Scalable Vector Graphics)ファイルを作成するためには、ベクタを扱うソフトウェアを使わなければならない。
ただし、イラストレーターやPhotoshopをお持ちでない、あるいはベクタ・グラフィックスの技が足りない方のために、簡単に作る方法を紹介します。
1. SVGを自動的に生成する
SVGeneration,com では、様々なSVGフラッフィックすの事例 / パターンが乗っています。好きなパターンを選び「Generate」をクリックすると、そのパターンに関する様々なパラメータをいじることができます。
SVGgeneration.com では.svgファイルをダウンロードしたり、SVGを表示(コピー)したり、またはCSSに直接張り込めるようBase64方式のData URIを表示しています。
2. SVGをオンラインで描くツール
Google SVG Edit v2.7
こちらはGoogleが出しているEditorです。
SVGのXMLを直接手加えることが可能になっています。
DrawSVG.org
慣れるまでは使いづらい印象を与えてくれますが、実は以外と沢山とオプションがあり、可能性を広げてくれます。Google のツールと異なり、SVGのXMLを表示させることができない(ダウンロードしてから表示は可能です)。
それらのツールを是非使ってみて下さい。意見や感想を是非コメントに書いて頂ければと思います。
SVGファイルを有効的に圧縮する手法について興味がある方は、今後ここで紹介する予定があるので、お楽しみ下さい!