Ao3 Theme - Blog Posts

hii i was wondering what ur process was for making skins ?? i am trying to make my own but ngl the process is annoying. i have a separate tab open js to see how the changes will look… 💀i need helpp 🙏🏾🙏🏾

Tbh the process is annoying and very fiddly, but there a definitely ways to make the actual writing it part easier!

I use an add-on called Stylus that lets you write CSS in a pretty way, will show you most syntax errors automatically, and will update the site live as you write it. It takes nearly all the difficulty out of actually writing the theme.

I normally split my screen between AO3 and Stylus like this:

(But note that Stylus is an actually well-maintained system, so if you're planning to copy-paste the code back into the AO3, then check your theme regularly, because Stylus will accept it just fine but AO3 may find reason to throw a tantrum.)

The next thing I suggest is uBlock Origin. Its core functionality is as an Ad-Blocker, so I recommend it on that alone lmao. Google recently updated its entire service just to ban Origin on Chromium, so I heavily advise not only Firefox in general, but Firefox for AO3 theme writing.

Origin, using its element picker feature, actually lets you more accurately, well, pick the elements you want to target. It will show exactly what you're selecting, and will let you move up and down the element hierarchy to get what you want. 85% of the time it'll do better than what you'll get with inspect element.

These two together really simplify the process.

Aiiiughm if you want more tips I can give you more but purely process-wise, this be it.