🦣

Font Awesome 5でMastodonのアイコンを表示するHTMLコード

2023/02/09に公開

Font Awesome 5ではMastodonのブランドアイコンを表示することができます。
https://fontawesome.com/v5/icons/mastodon?s=solid&f=brands

Mastodonアイコンの表示

Mastodonのアイコンを表示するHTMLコードは以下。

html
<i class="fab fa-mastodon"></i>

Mastodonアイコンにカラーコードの反映

https://joinmastodon.org/ja/branding

公式ページによると
\textcolor{#6364FF}{\#6364FF} \textcolor{#563ACC}{\#563ACC} \textcolor{#17063B}{\#17063B} \textcolor{#2F0C7A}{\#2F0C7A} \textcolor{#858AFA}{\#858AFA}
の、5色がブランドカラーとして指定されています。

styleを使用してブランドカラーを反映してみます。

html
<i class="fab fa-mastodon fa-2x" style="color:#6364FF;"></i>

Discussion