Font Awesome は、CSS と LESS をベースにしたフォントとアイコンのツールキットです。Dave Gandy によって作成され、Twitter Bootstrap で使用され、後に BootstrapCDN に統合されました。Font Awesome は、サードパーティのフォントスクリプトを使用しているウェブサイトの 20％のシェアを占めており、Google フォントに次いで 2 番目に多く使用されています。
ーー Wikipedia
まず、FontAwesome の公式ウェブサイトにアクセスしてツールキットをダウンロードします：https://fontawesome.com/download
Free For Web バージョンをダウンロードし、解凍して必要なすべてのファイルを取得します。
ウェブサイトのルートディレクトリに/assetsフォルダを作成し、その中に/cssと/webfontsフォルダを作成します。
解凍した/fontawesome-free-6.2.0-web/cssフォルダ内のfontawesome.css、brands.css、solid.cssを/assets/cssにコピーします。
解凍した/fontawesome-free-6.2.0-web/webfontsフォルダ内のfa-brands-400.woff2、fa-brands-400.ttf、fa-solid-900.woff2、fa-solid-900.ttfを/assets/webfontsにコピーします。
これらのファイルを任意のディレクトリに配置する場合は、brands.cssとsolid.css内のフォントの参照パスを変更することに注意してください
index.htmlの<head>タグ内で以下のように参照します：
<link href="./assets/css/fontawesome.css" rel="stylesheet">
<link href="./assets/css/brands.css" rel="stylesheet">
<link href="./assets/css/solid.css" rel="stylesheet">
これで、ウェブページ内で<i>タグを使用してアイコンを直接参照することができます。お楽しみください！
アイコンの参照方法については、公式ドキュメントをご覧ください
アイコンの検索：https://fontawesome.com/search
公式ドキュメント：https://fontawesome.com/docs
公式チュートリアル：https://fontawesome.com/docs/web/setup/host-yourself/webfonts