AO3 Site Skin: Sirens' Sailors
A '(Guest)' pfp
π πππΈ π πΌ π Disclaimers : I take no request. This one skin is specifically for handphone user only, for other devices unfortunately the skin would be too messy i think. But if you want to tinker with the skin and make the other devices friendly version, feel free, just credit me. I used this berry/reversi blue tag icons and followed little bits of this for header & this for some of the buttons. Images and pngs are from Tumblr and Pinterest. Dividers used in this post are from @uzmacchiato
οΉποΉ When i made my latest ao3 skin i stumble upon this beautiful aesthetic dividers by @rmstitanics and that's the origin of my motivation to make this skinβthe light mode for Serene Antipathy(more about that below the basic tutorial). I used some of her nautical set and edited it to fit my skin(i hope you don't mind, missπΆβπ«οΈ). Yes some of the images in this skin are moving like the og divider.
my ao3 skins masterlist
Tutorial how to activate the skin + the code :
βCopy the code i provided in this GitHub, there is a copy button at the top right(β’β’β’) of the code box. And here if you prefer Google doc.
βSign to your AO3 account, after that go to "Dashboard".
βOn your "Dashboard", tap on a section called "Skins".
βOn the "Skins" page, tap on the button labelled "Create Site Skin".
βGive your site skin a unique title, i usually use 2-4 word for the skins that i saved. IF YOUR SKIN NAME IS NOT UNIQUE, YOU CAN'T SAVE THE SKIN.
βPaste the codes you copied from my GitHub into the "CSS" box.
βWhen you're done, scroll to the bottom of the page and click a button labelled "Submit". This will save your site skin and take you to a new page where you can see the title of your skin as well as all of the code.
βClick "My Site Skin" and you can see the skin are added, press "Use" to activate it.
Added steps for those who want to have light mode[Sirens' Sailors] and dark mode[Serene Antipathy] auto-switch skins β
