こいつ、動くぞ！ 商用利用無料、シンプルにデザインされたSVGもフォントも揃った高品質なアイコン -Boxicons

2021/11/10 346 users SVG アニメーシ フォント こいつ アイコン

1,500種類以上のアイコンが揃った、Webサイトやスマホアプリにぴったりなシンプルにデザインされた無料アイコンを紹介します。 オープンソースで個人でも商用でも無料で利用できます。また、SVGアイコンとアイコンフォントで利用できるので、サイズやカラーの変更はCSSでできます。アイコンはリスト、固定幅、アニメーシ... 続きを読む

Font Awesomeの代替え版となるか!?オープンソースのアイコンフォント「Line - エンジニア・プログラマのソーシャルITメディア

2019/11/02 62 users プログラマ line Font Awesome エンジニア

◆ Line Awesome https://icons8.com/line-awesome 紹介 「Line Awesome」は、名前から分かる通りFont Awesomeをインスパイアしたオープンソースのアイコンフォントです。 1380以上のフリーフォントが無料で使えます。 <link rel="stylesheet" href="https://maxst.icons8.com/vue-static/landings/line-awesome/font-awe... 続きを読む

UI用のアイコンが1,400種類以上！商用でも完全無料で利用できる、シンプルなアイコン素材 -Remix Icon | コリス

2019/04/18 231 users SVG コリス デベロッパー UIデザイナー クライアント

商用でもクライアントのプロジェクトでも完全無料で利用できる、UIデザイナーやデベロッパーのためのアイコン素材を紹介します。 アイコンのアイテムはなんと1,441種類！ SVG、アイコンフォント、そしてPowerPoint...記事の続きを読む 続きを読む

こいつ動くぞ！商用利用無料、シンプルにデザインされたフォントもSVGも揃ったフリーのアイコン素材 -Box Icons | コリス

2018/06/28 301 users コリス SVG MITライセンス 商用 フォント

400種類以上のアイテムが揃った、Webサイトやスマホアプリにぴったりなシンプルにデザインされた無料アイコンを紹介します。 MITライセンスで、個人でも商用でも無料で利用できます。また、アイコンフォントやSVGとして利用...記事の続きを読む 続きを読む

260種類以上のアイコンが無料で商用利用OK、CSSツールキットも付属したアイコンフォント「Fontisto」 - GIGAZINE

2017/11/05 68 users GIGAZINE アイコン 商用利用OK 無料

続きを読む

260種類以上のアイコンが無料で商用利用OK、CSSツールキットも付属したアイコンフォント「Fontisto」 - GIGAZINE

2017/11/05 68 users GIGAZINE Instagram Twitter ロゴ

TwitterやInstagramのロゴやピクトグラムなど、ウェブサイトでは多種多様なアイコンが使われますが、そういったアイコンをウェブフォントにした「Fontisto」が無料で公開されています。商用利用もOKで、さらにCSSツールキットも付属。ライセンスは「 MIT License 」です。 Fontisto - the iconic font and css toolkit http://ww... 続きを読む

アイコンフォントか？ SVG アイコンか？ ¦¦ Website Usability Info

2015/12/16 56 users SVG UCD アイコン accessibility 公開日

Talking about web usability, accessibility, IA, UCD, UX,... 公開日 : 2015年12月17日 カテゴリー : アクセシビリティ , ユーザーインターフェース (UI) この記事は、「 Web Accessibility Advent Calendar 2015 」の17日目のエントリーです。 ウェブデザインにおいて、アイコンを配置するこ... 続きを読む

Bootstrapは無し、HTML5とCSS3のシンプルなコードで実装されたレスポンシブ対応のテンプレートのまとめ | コリス

2015/07/06 427 users コリス Bootstrap jQuery インタラクション

Bootstrapなどのフレームワークは無し、HTML5とCSS3のシンプルなコードをベースに、jQueryなどでいろいろなインタラクションやアイコンフォントなどを使ったレスポンシブ対応のテンプレートをTemplated...記事の続きを読む 続きを読む

sprite画像はもう終わり？gulpでIcon Fontをつくろう！ | MEMOPATCH

2015/01/26 55 users Gulp MEMOPATCH ベクターデータ 太朗 CSS

こんにちは。太朗です。 最近案件で使ったアイコンフォントが便利だったのでご紹介致します。 アイコンフォントのメリット スプライト画像はちょっとした色やサイズの変更も画像なので面倒ですよね。アイコンフォントを使えば色やサイズをCSSで自在に編集できるのでメンテナンスがかなり楽ちんです。なお、ベクターデータなので高解像度デバイスにも対応できます！ アイコンフォントをgulpで作る では、どうやってアイ... 続きを読む

アイコンフォントを横断検索できるサイト「GlyphSearch」 ｜ ライフハッカー［日本版］

2014/10/03 55 users Glyph フォント 横断 ライフハッカー アイコン

「GlyphSearch」はアイコンフォントを横断検索できるサイトです。アイコンを検索することができ、さらにアイコンフォントで使うタグをコピーすることができます。アイコンフォントを提供している複数のサイトを横断検索してくれるので便利。アイコンが一覧で表示されているので、お気に入りのものがあればそのフォントをいれてみるという使い方もできますね。 以下に使ってみた様子を載せておきます。 まずGlyph... 続きを読む

SVGでアウトラインをカスタマイズしてみよう | Webクリエイターボックス

2014/07/30 78 users SVG オブジェクト 装飾 記述 ベクター画像

これまで、二回ほどSVGに関する記事を書きましたが、SVGの面白さは伝わっていますかね…！？今回はSVGのアウトライン（線）の装飾に注目！オブジェクトを徐々に描いていくラインエフェクトにも挑戦します！SVGの基本的な情報や書き方は過去記事「アイコンフォントからSVGへ！より手軽にベクター画像を表示しよう」をご覧ください！ SVG線種プロパティの基礎 基本的な書き方ですが、SVGのコード内に直接記述... 続きを読む

SVGアイコンを実用するために知っておきたい、リンク周りの記述方法 | Webクリエイターボックス

2014/07/01 166 users SVGアイコン Webクリエイターボックス SVG 記述方法

以前書いた「アイコンフォントからSVGへ！より手軽にベクター画像を表示しよう」という記事でSVGの基本や効率よく使用する方法を紹介しましたが、実際にWebサイト内で使うにはもう少し具体例が必要だなーと思ったのでリンク関連を中心に補足します。基本的な記述方法を覚えて実用化していきましょう！ SVGにリンクを貼る SVGにリンクを貼りたい場合、単純に a タグで svg を囲んでもうまくリンクを貼るこ... 続きを読む

GitHubで使用されているアイコンフォント「Octicons」が一般公開を開始 - GIGAZINE

2014/06/17 263 users GIGAZINE GitHub Octicons アイコン

世界中のソフトウェア開発者のための共有ウェブサービスであるGitHubは、同サイトで使用されているアイコンフォント「Octicons」を一般向けに公開を開始しました。 Octicons http://octicons.github.com/ 公開されたアイコンフォントの一覧がこちら。GitHubが使っているアイコンだけあって、開発系のWebサイトやソフトに特化したアイコンが揃っているといえます。 ... 続きを読む

GitHub、アイコンフォント「Octicons」を一般公開 - 窓の杜

2014/06/17 75 users GitHub Octicons Atom アイコン 現地時間

ニュース GitHub、アイコンフォント「Octicons」を一般公開 “GitHub”や「Atom」で利用されているアイコンを自分のWebサイトにも （2014/6/17 14:37） 「Octicons」の公開サイト 米GitHub Inc.は16日（現地時間）、アイコンフォント「Octicons」を一般公開した。現在、同社のWebサイトからダウンロード可能。 「Octicons」は、同社が運... 続きを読む

SVGやアイコンフォントが揃ってる！太っ腹なライセンスで無料利用できる高品質なアイコン素材 -Themify Icons | コリス

2014/06/03 85 users コリス SVG ベクター 商用 アイコン

再販売だけがNGで、個人でも商用でも無料で利用でき、バックリンクやクレジット表記も不要の太っ腹なライセンスで提供されているアイコン素材を紹介します。 Themify Icons ライセンスが緩いからといって、アイコンの質が落ちるわけではありません。 アイコンはベクターで、極小サイズでも巨大サイズでも美しいまま利用できます。 ダウンロードできるアイコンはSVGとアイコンフォントで利用できます。 SV... 続きを読む

全600種類以上！ビジネスからホビーまで、ソリッドなラインでデザインされた美しい無料のアイコン素材 -Linea | コリス

2014/05/30 106 users コリス ソリッド ライセ TTF SVG

ビジネスからホビーまでさまざまなアイテムが揃った、ソリッドなラインが美しいアウトラインでデザインされたアイコン素材を紹介します。 アイコンは個人でも商用でも無料で利用できます！ Linea ダウンロードできるアイコンはウェブ制作でよく使うフォーマットが揃っています。 ベクター（.svg） アイコンフォント（.eot, .ttf, .woff, .svg） ビットマップ（.png） アイコンのライセ... 続きを読む

アイコンフォントからSVGへ！より手軽にベクター画像を表示しよう | Webクリエイターボックス

2014/05/28 529 users SVG Illu ブラウザー ベクター画像 普及

ベクター画像を表示する際とっても便利なSVG。名前を聞いたことのある方も多いのではないでしょうか？SVG自体は10年以上前から存在するのですが、HTML5の普及とともに多くのブラウザーでサポートされるようになり、今年に入ってから徐々に見かける機会が増えてきました。今回はそんなSVGにフォーカスしようと思います。 SVGってなに？ SVG（Scalable Vector Graphics）はIllu... 続きを読む

手軽にアイコンフォントを作成できる、無料オンラインジェネレーター9個まとめPhotoshopVIP |

2014/04/18 146 users ジェネレーター 配色 速度 エントリー たくさん

Webサイト制作で最近よく利用されているアイコンフォントは、配色を変更できたり、Retinaディスプレイ表示に対応したり、ページ読み込み速度が上がったりとメリットがたくさんあります。あなただけの特製アイコンフォントを作成しませんか。 海外デザインブログSmashing Appsで、オンライン上でアイコンフォントを手軽に無料で作成できるジェネレーターまとめたエントリー「Free Icon Font ... 続きを読む

誰でも簡単にフラットなアイコン画像を作れるiconion。しかも無料だなんて！

2014/03/19 162 users 起動画面 アイコン画像 アプリ 超オススメ 下記

アイコンフォントからアイコン画像を作れる『Iconion』というアプリを紹介します。最近よく見るフラットなアイコン画像を本当に簡単に作れるので超オススメです。今回はサクッとアイコンフォントからアイコン画像を作れる『Iconion』というアプリを紹介します。最近よく見るフラットなアイコン画像を本当に簡単に作れるので超オススメです。 iconion これがアプリの起動画面です。アプリは下記のリンク先で... 続きを読む

SVGアイコンを使ってみたい人にぴったり！実装は簡単で使い勝手のよいアイコンフォント -Stackicons | コリス

2014/02/24 51 users Photoshop レイヤー 特長 アイコン コリス

アイコンフォントに興味がある！ SVGアイコンデビューしたい！ という人にぴったりな実装は簡単、しかも使い勝手のよいアイコンフォントを紹介します。 多くのアイコンフォントは単色ですが、このアイコンは複数のカラーを使い、Photoshopのレイヤーのように重ねてあるのでカラーでなくアイコンの囲いも簡単に変更できます。 Stackicons Stackiconsの一番の特長はその名の通り、複数のカラー... 続きを読む

2014年、無料で商用利用できる最新フリーアイコン素材のまとめ | コリス

2014/02/05 487 users コリス flaticon ピクトグラム psd SVG

ビジネスやホビー、ブログや企業サイト、スマフォアプリなど、さまざまなシーンで無料で利用できるフリーのアイコン素材をまとめました。 注目の高いSVGアイコン、アイコンフォントをはじめ、スタイルもソリッド、フラット、ピクトグラムなどさまざまなものが揃っています。 flaticon 全34,370種類（2014年2月現在）33カテゴリが揃ったフリーのアイコン素材。SVGをはじめ、PSD, PNG, we... 続きを読む

Sassを使って時間短縮！アイコンフォントを手軽に使える方法 | 株式会社LIG

2013/11/28 86 users Sass 任務 時短 株式会社LIG モモコ

お疲れさまです、ももこです。 先日発売されたGE2のプレイ時間を確保する為に、作業の時短は重要な任務です。 今回はSassでアイコンフォントを手軽に使える方法をご紹介します！ アイコンフォントを使ってみたいけど導入方法が難しそう…という方にオススメです。 アイコンフォントの用意をする まずはアイコンフォントを用意します。 過去記事にアイコンフォントの紹介がありますので、宜しければご参考ください。 ... 続きを読む

スタンプフォント！ -スタンプみたいに使えるかわいいイラストのフリーフォント-

2013/10/07 232 users フリーフォント 商用 チラシ きっかけ 資料

スタンプみたいに使えるかわいいイラストのフリーフォントを配布しています。Webデザインやチラシ、資料のデザインにも！このサイトについて あると便利なシルエットデザインをアイコンフォントにして配布しています。 個人でも商用でも無料でお使いいただけますので、デザインのワンポイントにご活用ください！ このサイトをきっかけにいろんな人にもっと気軽にフォントを楽しんでもらえるとうれしいです。 このサイトの運... 続きを読む

全310種、美しいソリッドなラインで描かれたかわいいアイコン素材 -Elegant Icon Font | コリス

2013/10/02 339 users コリス TTF ベクタ EOT WOFF

ブログでも企業サイトでもよく見かける310種類のアイテムを美しいエレガントなラインで描いたアイコンフォントを紹介します。 Webフォントとして利用できるので、サイズやカラーなど変更しても美しいまま利用できます。.pngも入ってるので、画像で利用してもOK。 Elegant Icon Font ダウンロードできるアイコンのフォーマットは3種類。 フォント（.ttf, .woff, .eot） ベクタ... 続きを読む

リガチャなアイコンフォントをお手軽に作成する - アインシュタインの電話番号

2013/09/17 57 users リガチャ Twitter 正攻法 アインシュタイン CSS

リガチャなアイコンフォントを自作しようとするとけっこう大変そうで、そのためのアプリを揃えて操れるようになったり、リガチャの仕様を把握したり、専用のCSSを書いたりする必要がある。そういった正攻法のやり方としては、このページがとてもわかりやすかった。また、実際にそのページの方法によって制作されたLigature Symbolsも魅力的。 ところが自分が欲しいのは、Twitterで使っているアバターア... 続きを読む