Chapter Text
What Are Site Skins?
Site skins are customisable style sheets that alter the appearance of AO3. They are created using the CSS (Cascading Style Sheets) coding language.
If you want to learn more, I recommend reading the Skins and Archive Interface FAQ.
Create a Site Skin
This is also explained here in the FAQ. Here is my short version:
- Log in and go to My Dashboard → Skins → Create New Skin
- Give the skin a unique title
- Paste the code you want to use into the CSS field
- Click Submit to save the skin
- If you want to apply the skin, click the Use button
Combine Site Skins
You can combine site skins by either pasting different code parts into the CSS field, or by using the parenting method described here in the FAQ.
Customize the Site Skins Shared Here
I usually add comments to my code to make it easier to identify areas where you might want to make changes. A CSS comment always starts with /* and ends with */. Unfortunately, AO3 removes all comments from the code after you save the skin, which makes it harder to customize. Therefore, I strongly recommend that you download or copy the code and save it somewhere before you start editing.
Troubleshooting
If you find any errors while using the code shared here, you are welcome to report them to me. But please check first if you are using the latest version from the GitHub repository and update your skin if you aren't—maybe the issue has already been fixed.
You can leave a comment here, message me on Tumblr, or report bugs by creating an issue on GitHub.
I might not be able to fix every issue, but I'll try my best! I may also not be able to respond right away.
When sending me a message about issues with the skins shared here, please always specify the following:
- Device (computer, phone, tablet)
- Operating system (Windows, iOS, Android, etc.)
- Browser (Firefox, Chome, Safari, etc.)
- Other skins you are using