Material Symbols are our newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants.
この記事では、無料ダウンロードができて高品質なフリーアイコン素材を厳選してご紹介します。デザインコレクションに加えておくと、ウェブサイトやアプリの制作はもちろん、プレゼン資料やスライド作成、ブログ運営など何かと重宝するものばかりです。 無料で使いやすい!極上の最新フリーアイコン素材まとめ Motion Icons SVGアイコンにアニメーションを加えたデジアン素材で、無料版では12種類のモーションアイコンが実際のHTMLサンプルと一緒に同梱されています。 8000+ Essential Icon Pack 一度アプリをインストールしてしまえば、8000を超える商用ライセンス付きのアイコン素材から探すことができ、PhotoshopやIllustrator、Sketchといったデザインアプリに、ドラッグ&ドロップでアイコンを追加できます。WindowsとMacどちらにも対応。 Pure Sug
Macだとツールバーから、Winだとタスクバーから、14,700個のアイコンがコピペやドラッグ&ドロップでPhotoshop, Illustrator, Sketch, Officeなどのさまざまなソフトウェアで簡単に利用できる無料アプリを紹介します。 14,700個はビジネスからホビーまで全39カテゴリ、すべてIcons8のアイコンなので、同じテイストのデザインで非常に高品質です。下部にはプレゼント企画もあるので、チェックをお忘れなく。 応募期間は、2015年7月30日で終了しました。 Icons8 App Icons8 Appのインストールは、下記ページから。 上部でMac用・Win用を選択すると、下部の「Donwload Icons8 App」がそのOS用に変わるのでダウンロードしてください。 ※ダウンロードにはメールアドレスが必要です。 Icons8 App どんなアイコンが利用で
こんにちは、デザイナーのモモコです。 Webサイト制作をする上で欠かせないアイコン素材。デザイン性にこだわりたくても、「一からデザインしている時間がない!」という方もいますよね。 そこで今回は、数あるアイコン素材の中から、デザイン性に優れたおしゃれな無料アイコンを厳選してご紹介します。 線で構成されたライン系アイコンやシンプルなフラットデザイン、手書き風のアイコンなどをテーマ別に紹介しているので、これから制作するWebサイトの雰囲気に合わせてご活用ください。 なお、今回は基本的にロイヤリティフリーで使用できるものを集めましたが、ご利用になる際は各配布先にて利用許諾範囲を必ずご確認ください。 ※この記事は、2015年に公開されたものを最新情報を踏まえて編集部で再編成しました。 シンプル・フラットなデザインがおしゃれな無料のラインアイコン Streamline https://www.stre
Webサイトやアプリの制作の際に欠かせないものの1つに”アイコン”があります。しかし、 「自分で作るのは大変…。」 「お金をかけたくない!」 「プロは、どうしてるのかな…?」 こんな悩みを抱えている人も多いはず。そこで今回はSchooのデザインを手がけているデザイナーが実際に使っているおすすめのフリーアイコンサイトを5つご紹介します♪ ■目次 1.Font Awesome 2.ICON FINDER 3.flaticon 4.ヒューマンピクトグラム2.0 5.IcoMoon 1.Font Awesome スクーのサイト内のいたるところで使用している、Webフォントのアイコンサイト。 こちらのサイトのWebフォントのアイコンを使えば、画像を作らなくてもサイトにワンポイントで配置できます。 又フォントとして利用できるため、サイズや色をCSSで変更することが可能です。 2.ICON FINDER
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近はWeb Fontに人気が集まっています。それまでは一つの画像にまとめてスプライトしていたので、アイコンの使い方も移り変わりがあるようです。さらにSVGを使ったアイコンというの選択しもあります。 大事なのはバイナリからベクターベースになってきているという点で、さらに軽量さを求めるようになっています。今回はその一例としてiconoを紹介します。 iconoの使い方 実際の使い方です。 <i class="icono-mail"></i> <div class="icono-mail"></div> <span class="icono-mail"></span> <whatever class="icono-mail"></whatever> このように指定してアイコンが出ます。
Googleが公開しているデザイン・ガイドラインのアイコンに関するところを読みました。 Icons – Style -Google design guidelines アイコンのデザイン・ガイドラインの対象は、「プロダクト・アイコン」と「システム・アイコン」の2つがあり、デザインする上で注意を払うことや、原則がまとめられています。 プロダクト・アイコン 「プロダクト・アイコン」はGmailやGoogle Mapなどサービスそのものに用いられ、サービスの特性や違いを伝えるものです。 image by Google システム・アイコン 一方「システム・アイコン」は、ユーザインタフェースに用いられるもの。 「プロダクト・アイコン」と比べて、小さいサイズでの使用、単色での使用の想定が必要。 image by Google 作りの違い 「システム・アイコン」がフラットな作りなのに対し、「プロダクト・
セットになったアイコンはデザインが統一されており、それはそれで便利ですが、全部のアイコンを使うことはほとんどないと思います。 自分が必要なアイコンだけをセットにし、軽量化されたセットにして、WebフォントやSVGとして利用できるオンラインサービスを紹介します。 用意されたアイコンからセットを作ってもよし、自分のアイコンを加えてセットにすることもできます。 flat icon フォーマット:font(woff, eot, ttf, svg), png, svg, eps, psd 462種類のパック、55,000個のアイコンから使用するアイコンだけを選択し、セットにすることができます。チェックしたアイコンはクッキーで保存されているので、ログインしないでも利用できます。
アイコン型WebフォントをCSSでデザインしてボタンをいろいろ作ってみました。よく似た記事を書いたことがある気もしますが、今回はフラットな感じにしてみました。 ということで、まずこちらを読み込みます。 <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> これで準備はオッケーですので1つずつ解説します。 1. アイコンのみ 無駄な装飾はせず、普通にアイコンを並べるだけです。こういうのも意外と多いですね。 <div id="social-icon"> <a href="#"><i class="fa fa-facebook fa-2x"></i></a> <a href="#"><i class="fa fa-twitter fa-2x"></i
個人でも商用でも、Webページでもスマホアプリでも、無料で利用できるミニマルにデザインされた小さいアイコン素材を紹介します。 500種類全てデザインが統一されており、小さくてもミニマルなので、名前の通り「Clear」なアイコンに仕上がっています! Clear Icons -Solid ダウンロードできる素材は、Web制作者が使いやすいようさまざまなフォーマットが用意されています。 .psd .svg .png (Black & White) .csh PSDやベクターも嬉しいですが、カスタムシェイプも揃ってるのは嬉しさ倍ですね。 アイコンは全部で500種類! ビジネスやホビーなど、さまざまなアイテムが揃ってます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く