i made this theme, as it says its just reversi with pink accents and a few other details (icons changed, stats have icons and the buttons are flat) here is how it looks on pc
LGBTQ+ color coded tags — part of my AO3 Tweaks collection
an Add-on that color-codes LGBTQ+ tags on AO3 using their corresponding pride flag colors — so you can see at a glance what identities are in a fic while you're browsing✨
covers up to 30 orientations and the code is really detailed so hopefully any related tag variation will get picked up!
How to install?
Log into AO3 and go to Dashboard → Skins → My Site Skins → Create Site Skin (or click on the link it will take you straight to it)
Give it a name, then paste the code into the CSS field
Click Submit and then Use to activate it!
Code found here :
lgbt-tags-light.css — for light themes
lgbt-tags-dark.css — for dark themes
✦ AO3 skin: Rosé Pine — Closer to Home
✦ For more Add-ons: AO3 Tweaks
Default AO3 theme preview ↓
P.S: if you are already using an AO3 Skin and want to include this Add-on, you can either:
— combine the code into your skin CSS
— or use AO3's parent skin feature to layer skins on top of each other !which is more recommended for your codes not to break!
- based on a CSS by @blackbatcats
- inspired by Highlight AO3 Tags by @mistbornhero
It only took me two months (🫠🫠) but I think I’ve finally worked out my skin so it’s in its final form!! I’m so insanely proud and excited about this, so if you love it as much as I do pls pls leave me a comment, it means the world to me 😊
I don't know why did i do this, but here is the code , I stayed up late working on this, so I hope there aren’t any issues.
based on this code that turns the tags into text
and this pretty skin
setup steps:
click the code link above — it’ll open a long block of code. copy all of it (don’t include the title). it’s way easier to do this on desktop since mobile has copy limits
on AO3, go to your username → dashboard → skins → create site skin
give it a unique title, paste the CSS you copied, then scroll down and hit submit
once it’s created, just click “use” to apply the skin ˚ʚ₍ ᐢ. ̫ .ᐢ ₎ɞ˚
I’m not a native English speaker and I’m still figuring out Tumblr, so please excuse any mistakes.
Step 1: See an absolutely monstrous image on a reddit post about "worst possible AO3 features"
Step 2: realize that you could probably recreate that with CSS
Step 3: spend an hour of time you were supposed to be working just constantly thinking about how to do it
Step 4: spend your lunch hour (and another 20 minutes after work) making the thing
Step 5: profit???
If you would like to make your AO3 works pages look like some sort of cursed timeline full of broken ads, personal information, and AI then grab the code and make yourself a site skin 😆🤣
Note: this removes all of the buttons at the top of a fic and also I built it on my laptop with zero considerations for mobile. This is a shitpost kind of a site skin, so just try it for the visceral horrors and not for actual usability.
.notice a,
.comment_notice a,
.kudos_notice a,
ul.notes a,
.caution a,
.error a,
.comment_error a,
.kudos_error a,
.alert.flash a {
color: #506957;
font-weight: bold;
}
.filters .expander {
background: url("https://64.media.tumblr.com/3c89981f933f9f57157d6dcec6fd85a7/94c6737c6db9ad60-e5/s1280x1920/f7557e617a5439c506721bd326580a0cb4c1f8d8.png") left center no-repeat;
color: #f9f6ce !important;
font-weight: bold;
}
.filters .expanded .expander {
background: url("https://64.media.tumblr.com/dab095a2fd9387bc1e0c57747ba6b13f/94c6737c6db9ad60-ad/s1280x1920/c1a4e14e0565cdcac5d3e20bebac3ab440f2d607.png") left center no-repeat;
}
Hi there! It seems an ao3 update broke the skin I've been using, and the original creator seems to have dropped off Tumblr. I was wondering if maybe you could help?
I use @ao3skin 's dyslexia friendly site skin (altered for color but nothing beyond that). It's supposed to look something like this:
Recently however, the background of the work info seems to have extended into the rest of the work, like so:
I'm unsure how to fix this, but any advice would be much appreciated.
Hi! Adding this at the bottom of your site skin code should fix it:
I don't know why did i do this, but here is the code , I stayed up late working on this, so I hope there aren’t any issues.
based on this code that turns the tags into text
and this pretty skin
setup steps:
click the code link above — it’ll open a long block of code. copy all of it (don’t include the title). it’s way easier to do this on desktop since mobile has copy limits
on AO3, go to your username → dashboard → skins → create site skin
give it a unique title, paste the CSS you copied, then scroll down and hit submit
once it’s created, just click “use” to apply the skin ˚ʚ₍ ᐢ. ̫ .ᐢ ₎ɞ˚
I’m not a native English speaker and I’m still figuring out Tumblr, so please excuse any mistakes.
origamiaround
annaxmalina
andulkaphoto
kianamaiart
pixelskylines
gummygunk
