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

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

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

無料で1000個以上のアイコンフォントがダウンロードできる「WebHostingHub Glyphs」 - GIGAZINE

2013/03/13 498 users GIGAZINE PNG形式 ウェブフォント アイコン 使用

「ビジネス」「コミュニケーション」「コンピューター＆モバイル」「デザイン＆ライティング」など14のカテゴリーに分けられたアイコンフォント1000個以上が無料でダウンロードできるのが「WebHostingHub Glyphs」。アイコンはPNG形式、TFF形式の他、ウェブフォントとしても使用可能です。 WebHostingHub Glyphs http://www.webhostinghub.com... 続きを読む

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

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

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

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

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

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

CONDENSE-iconFont

2013/01/07 391 users CONDENSE-iconFont ウェブフォント

CONDENSE-iconFontは、ウェブフォントとしても使用出来るアイコンフォントです。A A B B C C D D E E F F G G H H I I J J K K L L M M N N O O P P Q Q R R S S T T U U V V W W X X Y Y Z Z a a b b c c d d e e f f g g h h i i j j k k l l n ... 続きを読む

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

レスポンシブやらアイコンフォントやらフラットやら！2013年の気になる技術やデザインを試してみたニューアル手順！ | バンクーバーのうぇぶ屋

2013/07/15 216 users レスポンシブ バンクーバー ディレクション プログラマー 去年

常々、僕はデザイナーでもなければプログラマーでも無く、どっちかと言えばディレクションがメインで、後はコンサル系の仕事が多いわけです。 しかし、WEBサイトを通して提案することがもちろん多いので、ここ最近良く見る技術やデザイン、その他試した方がいいんだろうなって物は一通り触っておく事を意識してきました。 去年はレスポンシブが多デバイス時代において必要なスキルの一つになるかと思い、とりあえず自分に出来... 続きを読む

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

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

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

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

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

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

アイコンフォントでリンクタイプ別にアイコンつける方法 | Webクリエイターボックス

2013/03/18 157 users Webクリエイターボックス フォントファイル フォント 総称

CSS3を使ったアイコンフォントで、テキストリンクをもう少し華やかに！画像を使うと案外手間がかかるテキスト横のアイコンを、Webフォントを使って簡単に表示させましょう。今回はリンク先や拡張子で異なるアイコンを表示する方法を紹介します。 アイコンフォントとは？ アルファベット1文字に1つのアイコンが設定されているフォントの総称です。サーバー上にあるフォントファイルを読み込んでフォントを表示する「We... 続きを読む

商用OKで、Webフォントにも使用可能な、シンプルで汎用的なアイコンタイプのフリーフォント・Modern Pictograms - かちびと. net

2012/01/20 149 users アイコンタイプ 反対 フォント 側面 Webフォント

ここ最近、この手のフォントがかなり増えてき ましたが、こちらも良い感じでしたのでご紹介。 Webフォントにも使用できる、アイコンフォント です。シンプルで汎用的なのでなかなか使い 易いのではないかなと思いました。セマンティ ック的側面では反対の声も見かけますけど。。 こういう、アイコンタイプのフォントもかなり目立ち始めましたね。以前、同じくWebフォントに使えるWeb Symbols typefa... 続きを読む

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

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

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

120種類以上の面白いアイテムがたくさん揃ったアイコンフォント -Sosa icon font | コリス

2012/09/05 132 users TrueTypeフォント コリス ユーザインターフェイス用

ブログやウェブサイトのユーザインターフェイス用にさまざまなアイテムを揃えた、商用でも無料で利用できるアイコンフォントを紹介します。 アイコンのカテゴリは、ウェブ、ソーシャル、Eコマース、デバイス、メディア、ツール、グラフ、文具、天気、乗り物、など多岐に渡ります。 Sosa icon font アイコンフォントは4種類のフォーマットが用意されています。 TrueTypeフォント EOT WOFF S... 続きを読む

フリーのiOS7アイコン800個セット:phpspot開発日誌

2013/09/17 109 users phpspot開発日誌 SEO PNG形式 Icons8 入手

Download 800 iOS 7 Icons for Free | Icons8 フリーのiOS7アイコン800個セット 25x25〜512x512のサイズでPNG形式で入手可能。 これだけあればアプリの開発やサイトの構築に便利に使えそうですね 関連エントリ SEOに関連するフラットなアイコン60個セット 美しいフラットなアイコンフォント「Dripicons」 200種類のフリーな汎用ベクター... 続きを読む

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

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

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

商用利用無料、癒やし系のゆる〜い感じのアイコンフォント -Handy Icons Vol2 | コリス

2013/02/28 88 users フォーマット フォント デモペー アイコン コリス

Handy Icons Vol2 – Free Web Font Kit ダウンロードできるフォントには、下記のアイコンが含まれています。 フォントなので、サイズもカラーも簡単に変更できます。 アイコンフォントのキャプチャ アイコンフォントのフォーマットは、下記の通りです。 TrueType OpenType EOT WOFF SVG ダウンロードファイルには、アイコンフォントを埋め込んだデモペー... 続きを読む

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

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

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

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

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

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

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

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

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

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」は、同社が運... 続きを読む