Advertisement

iOS-7-line-icons

 

iOS 7に採用された、ラインのみで描かれた、シンプルなアイコンデザインは、モバイルサイトの他に、Webデザインでも利用されるようになってきています。

 

海外デザインブログCSS Authorで、無料ダウンロード可能な、ライン型アイコン素材をまとめたエントリー「60+ Free Line Icon Sets」が公開されていたので、今回はご紹介します。シンプルなデザインが中心となり、汎用性のあるフリーアイコン素材が収録されています。

 

 

 

詳細は以下から。

 

 

 

シンプルで使いやすい、アウトライン無料アイコン素材まとめ

 

Simple Line Icons

Photoshop用PSD、Illustrator用AIファイルの他、SVG、PNGファイルで収録。

Simple-Line-Icons

 

 

24 Ecommerce Line Icons (PSD, Ai)

ショッピングサイト用アイテムを、Photoshop用PSDファイル、Illustrator用Aiファイルで収録。

24-Ecommerce-Line-Icons

 

 

Animal Line Icon Set

79種類の動物をモチーフにした、ライン型アイコン素材を、Illustrator用Aiファイルで収録。

79-Animal-Line-Icon-Set

 

 

Hanukkah Icons

icons_set_psd_11

 

 

PAGE

40種類のユニークな、ベクターアイコン素材セット。

PAGE-Free-icon-set

 

 

Other Icons

Photoshop用PSD、Illustartor用Ai、EPSファイルのほか、PNGファイルも収録。こちらのエントリーで詳しく紹介しています。

Othericons

 

 

Line Icon Set for UI & More

Photoshop用PSD、Illustrator用AI、EPSファイルで収録。

Line-icon-set-for-UI-more

 

 

Weather Icons

Photoshop用PSDと、Illustrator用AIファイルで収録。

42-Weather-Icons1

 

 

iOS 7 Inspired Line Icons

iOS 7に使われている、全80種類のアウトラインアイコン素材を、EPSファイルで収録。

iOS-7-Inspired-Line-Icons

 

 

Tab Bar Icons iOS 7

Photoshop用PSDファイルと、Illustrator用Ai、EPSファイルで収録。

Tab-Bar-Icons-iOS-71

 

 

Tab Bar Icons iOS 7 vol.2

Photoshop用PSDファイルと、Illustrator用Ai、EPSファイルで収録。

Tab-Bar-Icons-iOS-7-Vol2

 

 

Tab Bar Icons iOS 7 vol.3

Photoshop用PSDファイルと、Illustrator用Ai、EPSファイルで収録。

Tab-Bar-Icons-iOS-7-Vol3

 

 

Tab Bar Icons iOS 7 vol.4

Photoshop用PSDファイル、Illustrator用Ai、EPSファイルで収録。

Tab-Bar-Icons-iOS-7-Vol4

 

 

Line Icons

Illustrator用EPSファイルのほか、PDF、PNGファイルで収録。

Line-Icons-–-Free-Line-Icons-for-Web-and-UI-Designs

 

 

Simple Icons PSD

Photoshop用PSDファイルのほか、PSDファイルでも収録。

Simple-Line-Icon-PSD

 

 

45 Blue Drops

Photoshop用PSDファイルで収録。

45-Blue-Drops

 

 

Budicon Tester

Photoshop用PSDファイルで収録。

Budicon-Tester

 

 

Simple Line Icons

Webフォントとして活用できるTTF、EOT、WOFFファイルのほか、SVGファイルも収録。

Simple-Line-Icons-Webfont

 

 

Dripicons

Photoshop用PSDファイル、Illustrator用AI、EPSファイル、PDF、SVGファイルの他、Webフォントでも収録。

Dripicons

 

 

48 Vector Icons

Photoshop用PSD、Illustrator用Aiファイル、PNG、SVGファイル、Webフォントを収録。

Linecons-Free-–-Vector-Icons-Pack

 

 

Circular Icon Set

サークルデザインを加えたスタイルで、Photoshop用PSDファイルで収録。

Circular-Icon-Set

 

 

Rectangular Icons PSD

Photoshop用PSDファイルと、PNGファイルと収録。

Rectangular-Icons-PSD

 

 

21 eCommerce Icons

ショッピングサイト用アイコン素材21個をセットにした、Photoshop用PSDファイルで収録。

21-E-Commerce-Icons

 

 

24 Unique Web Icons Freebie

Illustrator用Aiファイルのほか、Webフォントとしても利用可能。

24-Unique-Web-Line-Icon

 

 

IconSet Free Download

Line-ICONSET-Free-Download

 

 

Modrn Minimal Glyphs

Photohsop用PSD、CSH(カスタムシェイプ)ファイル、 Illustrator用Aiベクターファイルで収録。

Modern-Minimal-Glyphs

 

 

Line Set

Line-Icon-Set

 

 

Minimalistic and Simple Icons

PNGファイルで収録された、丸みのあるデザインアイコンセット。

Dortmund-icons

 

 

iOS 7 Glyph Icons

Photoshop用PSDファイル、Illustrator用Ai、EPSファイルで収録。

iOS-7-Glyph-Icons

 

 

50 Free PSD Glyphs

PSDファイルで50個のファイルを収録。

50-free-psd-glyphs

 

 

まとめ iOS 7にも採用、アウトライン化されたシンプル無料アイコン素材まとめ

半年ほど前にまとめたエントリーとなりますが、こちらもご一緒にいかがでしょう。

bicycles-icons-psd

 

 

 

参考チュートリアル Animated SVG Icons with Snap.svg

Adobe社が公開した、JavaScriptライブラリSnap.svgを利用することで、SVGアイコンファイルに多彩なアニメーションを加えることができます。

AnimatedSVGIcons

[button_square color=”orange” url=”http://tympanus.net/Development/AnimatedSVGIcons/”] デモページ [/button_square] [button_square color=”green” url=”http://tympanus.net/codrops/2013/11/05/animated-svg-icons-with-snap-svg/”] ダウンロードページ [/button_square]

 

 

サムネイル@ : iOS 7 Line Icons by Chirag Dave – UiJunction(詳細はこちらのエントリーで)

参照元リンク : 60+ Free Line Icon Sets – CSS Author