Iconbuddy - 30万点以上のオープンソースSVGアイコンを検索・編集

 (iconbuddy.app)
5 ポイント 投稿者 GN⁺ 2023-07-24 | 1件のコメント | WhatsAppで共有
  • Iconbuddyは、複数のオープンソースアイコンライブラリを一か所で検索し、色やサイズを調整してダウンロードできるアイコン検索エンジン
  • サービスのメタデータによると、300,000点以上の無料SVGアイコンを提供しており、アイコンセットを個別に探し回る手間を減らせる
  • エクスポートはSVG、PNG、JSX、Base64に対応し、デザインモックアップとフロントエンドのコード作業の両方で活用可能
  • 世界中の500K+のプロフェッショナルが利用しており、Framer、Midjourney、Figma、Google、Microsoft、DigitalOceanなどの利用先が挙げられている
  • HeroIcons、Tabler Icons、Google Material Icons、Fluent UI System Icons、Noto Emoji、Font Awesome、Simple Iconsのようなオープンソースアイコンライブラリを一か所で探索できる

検索からエクスポートまでを一つの流れで

  • Iconbuddyはオープンソースアイコン検索エンジンで、「すばやく検索し、自由に編集し、すぐにダウンロードする」流れを提供する
  • サービスのメタデータによると、主な機能は次のとおり
    • 300,000点以上の無料SVGアイコンの検索とダウンロード
    • 色とサイズのカスタマイズ
    • SVG、PNG、JSX、Base64形式でのエクスポート

利用規模と利用先

  • 世界中の500K+のプロフェッショナルが利用していると案内されている
  • 利用先として次の名前が挙げられている
    • Framer
    • Midjourney
    • Figma
    • Mobbin
    • Google
    • Microsoft
    • cohere
    • CashApp
    • Buy Me a Coffee
    • DigitalOcean
    • Roadmap.sh
    • Letter

含まれる主なアイコンライブラリの例

  • 汎用アイコンセット

    • Fluent UI System Icons: 18,519点
    • Material Symbols Light: 14,910点
    • Material Symbols: 14,840点
    • Google Material Icons: 10,955点
    • Phosphor: 9,072点
    • Material Design Icons: 7,447点
    • Solar: 7,401点
    • Tabler Icons: 5,963点
    • Huge Icons: 4,556点
    • Game Icons: 4,123点

  • 開発・ファイルアイコン

    • VSCode Icons: 1,397点
    • Material Icon Theme: 1,106点
    • Devicon: 957点
    • Devicon Plain: 700点
    • Codicons: 497点
    • Skill Icons: 397点

  • ブランド・ロゴアイコン

    • Simple Icons: 3,364点
    • SVG Logos: 1,837点
    • Logos free icons: 1,362点
    • Font Awesome Brands: 548点
    • CoreUI Brands: 830点

  • 絵文字・フラグアイコン

    • Noto Emoji: 3,710点
    • Twitter Emoji: 3,668点
    • OpenMoji: 4,185点
    • Fluent Emoji Flat: 3,145点
    • Flag Icons: 542点
    • Circle Flags: 632点

実務での活用形態

  • 複数のアイコンライブラリを個別に訪問せず、一か所で検索・編集・ダウンロードできる
  • 色やサイズの調整、複数のエクスポート形式への対応により、デザイナーと開発者が同じアイコンアセットをそれぞれの作業環境に合わせて利用できる

関連記事

1件のコメント

 
GN⁺ 2023-07-24
Hacker Newsの意見

  • アイコンごとのライセンスと作者を見られるとよさそう
    今のところ、全アイコン検索で見つけた場合は無理に見えるのだけど、何か見落としているのか気になる

    • ここでライセンス情報がないことはかなり致命的
      「オープンソースアイコン」という表現を使っているが、最近その言葉は乱用されすぎていて、あまり意味がないように見える
      いくつか確認してみたところ、ダウンロードしたSVGファイル内にもライセンス情報は見当たらない
    • 少なくとも出典は必要。これがないと役に立たない
      技術的にはオープンソースかもしれないが、その利点はほとんど失われる
      例えば https://iconbuddy.app/bxl/amazon や https://iconbuddy.app/devicon/google のようなところで、すぐに見える問題がある。もっと知名度の低いサービスのアイコンではどれほどなのか分からない
      CC-BYなので著作者表示が必要なアイコンがどれだけあるのか、アイコンを盗んできてCC0だと主張する怪しいライセンスロンダリング元がどれだけあるのかも分からない
    • これはおそらくオープンソースではなく、商標権の問題もありそう: https://iconbuddy.app/bxl/amazon
    • メインページにも、アイコンのライセンスと出典を説明するセクションが必要。見つけられなかったので、すぐにページを閉じた
    • コレクション名の横にある情報アイコンを押すと、ライセンス詳細、GitHubリポジトリ/Figmaファイル、作者/デザイナー情報を見られる

  • The Noun Projectのほうが大きく、500万個のアイコンとより明確なライセンスを提供している: https://thenounproject.com/

    • Pro版に年40ドル払っているが、アイコンや簡単なイラストが必要なときにとても良い
      複数のアイコンを合成して使うこともかなり多いし、本当にほぼ何にでも対応するアイコンがある
      “Affair”
      https://thenounproject.com/icon/cheating-10395/

  • https://iconify.design/をここ数年、主に使っている
    UIで色を変えられる機能は気に入っているが、個人的には色にはTailwindクラスを使っている

  • 良い！ Anthony Fuの似たプロジェクトもある: https://icones.js.org
    どちらも同じIconifyフレームワークに依存しているので、同じアイコンのスーパーセットを共有しているのか気になる

  • 本当に素晴らしい :)
    ごく小さな機能リクエスト/提案をすると、検索結果を見るときに、各結果が属する親コレクションへのリンクもあるとよさそう
    例えば検索結果で気に入ったアイコンを見つけたとき、それがどのコレクション由来なのか知りたい

    • サイトのアイデア自体は悪くないが、検索結果がどのコレクション由来なのか見えないと、かなり役に立たなくなる
      ライセンスもサイトに表示されていないので、アイコンセットが分からなければ自分で調べることもできない

  • 最近、両親の家の戸棚を整理していたらクリップアートの箱を見つけた
    ディスク50枚に分かれていて、価格は50ドルだった。値札もまだ付いていた。おそらく1990年ごろのものだと思う
    考えてみると、今ではそうしたアイコンコレクション一式が無料で、すぐに使える

    • 今のお金では116ドル
      かなり良い副業だったのだろう

  • 良いけれど、自分は https://icones.js.org/ のほうが好み

  • https://fontawesome.com と比べてどうなのか気になる
    追記: このページを見るとスーパーセットのように見える: https://iconbuddy.app/fa-solid

  • 自己責任で使うべき。ライセンスがなく、アイコンの出所もあちこちから持ってきたもの

  • 完全にカスタマイズ可能だって？ 変えられるのは色だけ

    • 背景も複数の方法で変えられるので、その程度でもかなり良い付加価値だと思う