Archive of Our Own: Yay, Skins Are Coming! Beware, Skins Are Coming

The good news!

Shed your skin! We’re about to have a massive deploy of new code on the Archive of Our Own that will bring us – among other things – radically new skins! The underlying code for the Archive has been streamlined and modified to make it more accessible and maintainable, and much easier to override. This is going to allow for fantastically beautiful and awesome customizable looks for the Archive; fanartists, prepare to go wild! As a bonus, we’ve also added some skins options for logged-out users (you’ll find these in the footer)!

The bad news 🙁

Since we had to radically retool the underlying code to make this all work well, existing skins are not going to work right out of the box. (We did mention that this was an archive in beta, right?) We’re really sorry for the inconvenience, but we had to sacrifice consistency in the short term to make the skins feature more awesome and ensure our code remains maintainable in the long term.

To make sure that no one comes to the archive and finds a broken skin, we’ll be temporarily turning off the existing skins when we deploy the new code – don’t be alarmed if you come to the Archive to find it looks different! You’ll be able to preview your old skins to see how they’ll look with the new code, so you can fix the private ones before turning them back on if necessary. We’ve also already upgraded a bunch of the existing public skins and added some new ones– for instance a new light-on-dark skin, and a new plain text skin. We’ll be posting a list of these skins as soon as the code deploys.

What’s so great about the new skins?

LOTS OF STUFF! \0/ One major improvement is that you’ll no longer have to use the dreaded !important for most of your overrides to the default skin. In fact, if you want to you can strip away our default skin altogether and write your styles without using any of our CSS at all. But that’s only the beginning! There are a whole bunch of new features:

  • Modular system so you can make your skin a ‘child’ of another skin. This means that when you find that skin which has a perfect layout but a color you hate, you can apply that skin for your layout, then add another one on top which just changes the color. (And that’s just the beginning of what you can do with the modular skins – we’ll have more in a future post explaining the cool possibilities.)
  • Make different skins for different devices (this is courtesy of the modular skins) – you’ll be able to make a custom skin for when you’re browsing on your computer, and another one for when you’re browsing on your phone, and have them kick in automatically when you’re logged in to your account (providing your phone respects mobile stylesheets). Customization wherever you are!
  • An array of images you can use to customize your skins! You can already use images hosted offsite in your own skins (but not in public ones because we need to be sure the images won’t change or break). Now you’ll be able to pull from a bunch of stock images on the Archive to make your skins even prettier.

Essentially, the new system is aimed at giving you control of ALL THE THINGS! We’ll be posting a list of pre-loaded skins as well as loads of shiny new skins over the coming days. We’ll also post tutorials and examples so you can get to grips with the new shiny!


All may not be lost! If your skins are broken or you think they’re likely to be, you can do some things to prepare. We’ll be holding a Skins Open House in a week or two where we’ll go over how to make new skins and fix old ones – watch this space for news on that.

Accessible skins

One last note – one reason it was important to us to make this change is that it makes it MUCH easier to customize skins to meet specific accessibility needs. If you are using one of the public skins geared towards particular accessibility needs (e.g. low contrast, plain text, etc), then we have either fixed this to work right out of the box under the new system or (where that wasn’t feasible) added a new skin to do the same job. We’re adding new accessible skins for logged-out users too – you’ll be able to access a Low Vision skin and a Light on dark Small Text skin in the footer even when you are logged out. If you need a customized skin for accessibility reasons and our existing skins don’t meet that need, please get in touch with support and let us know what you need – we’ll do our best to help! (Also, if you run up against an accessibility issue anywhere on the Archive, please let us know – we’re committed to keeping the site as accessible as possible, but inevitably there’s stuff we miss!)

Stay tuned for more info about skins!

Mirrored from an original post on the Archive of Our Own.

Archive of Our Own

Comments are closed.