If you’re familiar with using CSS, you can give your Mastodon server’s website interface a new look through the Custom CSS feature:
- Log into your server’s website using the admin account
- Go to Preferences > Administration > Server Settings
- Click the Appearance tab and go to the Custom CSS section
- Add the CSS code you want in the box, then click Save Changes
⚠️ Using custom CSS prevents your server’s users setting their own theme when logging in through your server’s website. In the worst cases this may cause accessibility issues, as some users rely on being able to choose either light or dark or high contrast themes. If you’re going to use the Custom CSS feature, check your users are okay with it before permanently making changes.
Is there any ready-made CSS code available?
Yes, there are pre-existing themes which can be installed through Custom CSS if you prefer. For example, there’s the lovely Tangerine theme ⧉ or the Twitter-style Bird UI ⧉.
Can I add custom CSS as a theme option from the Themes dropdown menu, so that users on my server can choose which theme they want?
Yes you can, but it’s a lot more complicated. Third party themes include instructions for this on their websites, for example the Tangerine theme has a section on how to install it as an optional custom theme ⧉. You will need more technical skills to do this and access to your server’s files. If you’re on managed hosting, ask the hosting provider if it is possible to install custom themes.