Default icon set alternative?

I would like to replace standard icon set with my own. Talking about grade, flag, lock, mail… svg replacement.
What would be the procedure.
Thanks, all the best

I’m not actually sure what icons you’re referring to, but I assume those are the privacy icons etc. in the WebUI. In this case, most of them (with the exception of the “boost” icon that is a SVG embedded in the stylesheet) are from fontawesome.

You basically have two options here:

  • fork and modify the fontawesome font
  • override individual icons in the same way the boost icon is handled (see app/javascript/styles/mastodon/boost.scss)

both options are quite some work, unfortunately

1 Like

Thanks for a fast reply Claire.
I will try editing inline svg in according scss.
Will report.

I am going to host Font Awesome myself so I can edit it locally.
Where in html (javascript injected I presume) can I point to it like

<head>
  <link href="/your-path-to-fontawesome/css/all.css" rel="stylesheet"> <!--load all styles -->
</head>

And then use it like this

<body>
  <i class="fas fa-user"></i> <!-- uses solid style -->
  <i class="far fa-user"></i> <!-- uses regular style -->
  <i class="fal fa-user"></i> <!-- uses light style -->
  <!--brand icon-->
  <i class="fab fa-github-square"></i> <!-- uses brands style -->
</body>

Thanks