Actions

Work Header

[AO3 Site Skin] Spirits and Such

Summary:

A custom AO3 css site skin inspired by the Spirits & Such website that Reigen designs in season 2, episode 3 of Mob Psycho 100.

CLICK NOW to enjoy the greatest psychic of the century's graphic design skills while browsing AO3!!!!

Notes:

(See the end of the work for notes.)

Work Text:

Get the Skin HERE:

Pastebin: Desktop / Mobile


Previews for desktop/mobile: 

/ desktop:

/ mobile: 

         


Design Notes: 

  • AO3 now looks like the Spirits and Such website! 
  • Many New Colors
  • all guest comments are reigen's face
  • gold picture frame to adorn yours and others' dashboard avatar
  • added header image
  • added footer image
  • background pattern
  • border colors / line spacing
  • layout expanded from AO3's "Simply Twilling" 
  • color-coded fic tags 
  • comic sans font (desktop only) 
  • color alternating comments
  • links and buttons change color when you hover over them (*sometimes)
  • separate skins optimized for mobile/desktop
  • dimple buttons
  • No More Annoying Muted Users Banner
  • funny ghost gif
  •  Feel like you're ordering an exorcism from your boy reiggy
  • And More!

Directions For Using:

  1. Click on the Pastebin link intended for your device type: Desktop / Mobile
  2. Select and copy EVERYTHING in the Pastebin link. If you're on desktop, this can be done simply with "ctrl A" and "ctrl C". If you're on mobile, quickly tap your screen two times, and a "select all" option should appear. You'll click "select all" and will see an option to copy from there.
  3. After you copy my code, go to this link: https://archiveofourown.org/skins/new?skin_type=Skin This "Create a New Skin" page is how you're going to import and use the skin.
  4. You only need to mess with TWO things on this page: (1) the title and (2) the CSS box.
  5. Titling the skin: I reccomend using the title "Mobile Spirits" or "Desktop Spirits" so you can differentiate which device-optimized skin you're using.
  6. CSS box: paste the earlier CSS code you copied into the textbox labelled "CSS".
  7. Scroll to the bottom of the page and press submit.
  8. Click "use skin" on the "My Site Skins" page and BOOM!!! Now you are using the AO3 Spirits & Such skin!!!!

Get the Skin HERE:

Pastebin: Desktop / Mobile

Notes:


reigen 💖 please comment if you use the skin or have questions :-)

Series this work belongs to: