高解像度Retinaディスプレイに対応したSVGアイコンが見つかるサービスをご紹介

高解像度Retinaディスプレイに対応したSVGアイコンが見つかるサービスをご紹介

AppleがRetinaディスプレイを発表してからアイコン画像を高解像度ディスプレイに対応するために2倍の大きさのJPEGやPNG画像を用意して、半分のサイズに縮小して当てこんていました。

そんな手間を省くために広まりつつあるSVGアイコンをまとめたサービスをご紹介です。

SVGアイコンって何?

SVG(Scalable Vector Graphics)はベクター形式の画像ファイルを表示する技術です。JEPGやPNGと違いベクター形式の画像は拡大縮小しても画像が劣化しないという特徴があります。

SVGアイコンが見つかるサービスをご紹介

1. Glyphs Company

https://gyazo.com/0a0f51071a9cc8bd8924ea5acfc8779b

フラットアイコンから手書き風のアイコンなどをワンタップでインラインSVGとして利用可能です。
https://gyazo.com/85d14a56dd5025333cfeeffe62ee168b

2. The Noun Project
https://gyazo.com/d6f4d4dcfc33e44c8130914909fa9063

フラットアイコンが検索して見つかります。類似のアイコンもおすすめされるので簡単に見つかります。

SVGをサポートしているブラウザ

SVGの画像ファイルは10以上前の2001年にW3Cに勧告されました。

しかし、当時はIEでサポートされていなかったことから利用はほとんどされていませんでした。

2011年からIE9に正式に対応したことで徐々に利用されるようになってきました。

HTML5でインラインSVGを表示できるかはCan I useにまとまっています。
https://gyazo.com/c575abfa6716f329e8b942203f1fce1c

SVGアイコンが見つかるサービス紹介はいかがでしたか?

SVGアイコンを利用できる環境が整ってきました。

SVGを使っている企業としてAppleなどを筆頭に多くの有名企業が参加してきています。

ぜひみなさんもこの機会にご利用ください。

【PR】
Dot metrix広告2

最近の投稿

More

Dot metrix

Dot metrix広告2