Font Awesome アイコン

Q: Font Awesome アイコンは商用利用でも無料ですか?

はい。SVG Logos icons は CC0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。

logos:font-awesome

Font Awesome アイコン(logos:font-awesome)は、SVG Logos セットの無料 SVG アイコンです（作者: Gil Barbara）。 256 × 258 のグリッドで描かれています。 SVG Logos icons は CC0 ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: SVG Logos
作者: Gil Barbara
ライセンス: CC0-1.0
サイズ: 256 × 258
タグ: fontawesome

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="258" viewBox="0 0 256 258"><path fill="#528dd7" d="M103.894 9.194c18.154 0 30.568 4.597 42.98 9.194l.902.335l1.21.448l1.208.446l.605.222l1.21.442c10.702 3.887 21.742 7.3 37.386 7.3c15.23 0 26.175-3.233 36.429-6.988l1.18-.435l1.175-.44l1.172-.442l.584-.221l1.169-.445l.584-.222l1.752-.667c7.021-2.665 14.143-5.256 22.56-6.869v183.88c-7.716 1.478-14.343 3.778-20.803 6.205l-1.172.442q-1.17.442-2.337.888l-1.753.667l-.585.222l-1.171.441c-10.952 4.114-22.383 7.864-38.784 7.864c-15.403 0-26.426-3.31-37.03-7.122l-1.221-.442l-1.22-.445l-1.218-.448l-1.218-.45l-.901-.33l-1.244-.457l-.622-.23l-1.245-.455l-.623-.227l-1.25-.452c-10.85-3.9-22.221-7.33-37.71-7.33c-12.855 0-22.657 2.304-31.567 5.28v-36.776c8.91-2.976 18.712-5.28 31.568-5.28c16.666 0 28.494 3.874 39.924 8.066l1.223.45l1.832.678l.903.335l2.418.894l1.21.443l1.168.425l.585.21l1.174.418c9.996 3.53 20.548 6.47 35.064 6.47c12.707 0 22.432-2.252 31.26-5.179V59.179c-8.829 2.927-18.552 5.179-31.26 5.179c-15.424 0-26.456-3.319-37.072-7.137l-1.2-.435l-1.198-.437l-1.219-.448l-1.218-.45l-.901-.33q-1.554-.574-3.11-1.143l-1.249-.453l-1.252-.45c-10.662-3.805-21.892-7.105-37.082-7.105c-15.252 0-26.205 3.242-36.471 7.004l-1.16.428l-1.154.431l-1.172.442l-1.17.444l-1.168.445q-1.167.445-2.337.888l-1.172.442c-10.95 4.113-22.382 7.864-38.783 7.864q-.462 0-.92-.004V27.578q.458.004.92.004c16.401 0 27.834-3.75 38.784-7.864l1.171-.442l.585-.221l1.169-.445l.583-.222l1.753-.667c11.496-4.364 23.26-8.527 40.542-8.527"/><path fill="#193154" d="M18.388 0C8.233 0 0 8.233 0 18.388v220.655c0 10.155 8.233 18.388 18.388 18.388s18.388-8.233 18.388-18.388V18.388C36.776 8.233 28.543 0 18.388 0"/></svg>

Font Awesome アイコンの使い方

React

import { Icon } from "@iconify/react";

<Icon icon="logos:font-awesome" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="logos:font-awesome" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="logos:font-awesome" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--font-awesome]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:font-awesome"></div>

Web コンポーネント

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="logos:font-awesome"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/logos/font-awesome.svg" alt="Font Awesome アイコン" width="24" height="24">

他のアイコンセットの Font Awesome アイコン

Font Awesome アイコンのよくある質問

Font Awesome アイコンは商用利用でも無料ですか?

はい。SVG Logos icons は CC0 ライセンスで公開されており、個人・商用プロジェクトで利用できます。

React で Font Awesome アイコンを使うには?

@iconify/react をインストールして <Icon icon="logos:font-awesome" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。

Font Awesome アイコンをウェブページに追加するには?

画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/logos/font-awesome.svg" alt="Font Awesome アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。

SVG Logos アイコンをすべて見る →