Ao3 Skins

[kateokate]

im IN LOVE with your ao3 skin!!!!!!!!!

Thank you <3333 that means a lot to me, and I will be sharing many many other site skins🤭

[kateokate]

Begging on my knees for a grey foresty coldcore css for ao3

I definitely love coldcore (especially the YT playlists) and grey is my preferred reading background. Thanks for putting the idea in my head🤭

This also makes me want a Zara Larsson summer skin 🐬 (I'm a summer girly in the end)

[kateokate]

hiii I love ur skins so much if you take requests can you make a Harry Potter or f1 themed skin?

Hello, sorry for the late reply.

I don't mind requests and I'm planning on making a Hogwarts houses site skin, but I have too many codes that are halfway done so it might take me some time.

[kateokate]

Red Skin

Inspired by the 'Red Velvet' Irene&Seulgi Photoshoot.

I'm also working on a blue version that should be ready soon 💙

AO3-Site-Skins/Red(black and white) Skin at main · KatherineKitkat/AO3-Site-Skins

Ao3 site skin. Contribute to KatherineKitkat/AO3-Site-Skins development by creating an account on GitHub.

Desktop version: https://github.com/KatherineKitkat/AO3-Site-Skins/blob/main/Red%20%28W%26B%29%20Skin%20Desktop

[kateokate]

Hiii this skin is gorgeous!! I just wanted to inform you that the Om symbols next to every tag are a hindu religious symbol so it is slightly disrespectful to have that next to smut tags. I by no means ask that you adhere to my religion, I just wanted to let you know incase you didnt. I was also wondering if you had any similar skins without Om? sorry i lowk cant comment for some reason..

Hello, I'm glad you like the site skin and I'm sorry if I caused any discomfort by using the Om sign in the tags section or any other religious symbol. I admit that I was shortsighted regarding the use of religious symbols in the Zen skin as I only saw the aesthetic link between them since they are commonly used this way without thinking further about the potential appropriation of said symbols.

I'll remove the 🕉 sign from the tags as they are unpredictable in nature, thank you for sharing you thoughts with me :)

[kateokate]

@banbidoll Here are alternative tag designs for better visibility.

original post => https://www.tumblr.com/kateokate/820445819422507008/winx-skin?source=share

2nd look:

3rd look:

This looks more separate on mobile

Instructions: go to the original code and look for ' .tags a.tag { ' then delete everything starting from it until ' .freeforms .tag {

background-color: #f4dfe2;

color: #000;

} '

THEN paste the code of the design you want in its place.

1st design =>

.tags a.tag {

color: #000 !important;

line-height: 2.8;

text-decoration: none;

padding: 5px 9px;

border: 1.6px solid #FFCBE7;

border-radius: 10px;

}

.tags a.tag::after {

content: "ཐི༏ཋྀ";

color: #ffcb43;

text-shadow: 0 0 3px #fff;

margin-right: 2px;

}

.warnings .tag {

background-color: #EFD1D1;

color: #000 !important;

}

.relationships .tag {

background-color: #FFECF9;

color: #000 !important;

}

.characters .tag {

background-color: #E8FFE0;

color: #000 !important;

}

.freeforms .tag {

background-color: #DEEAEE;

color: #000;

}

2nd design =>

.tags-container {

display: inline-block;

border: 2px solid #ffcb43;

border-radius: 12px;

padding: 10px;

}

.tags-container a.tag {

background-color: #ffcb43;

border: none;

border-radius: 8px;

padding: 10px 12px;

margin-right: 4px;

display: inline-block;

}

.tags a.tag::after {

content: "ཐི༏ཋྀ";

color: #ffcb43;

text-shadow: 0 0 3px #fff;

margin-right: 2px;

}

.warnings .tag {

background-color: #EFD1D1;

color: #000 !important;

}

.relationships .tag {

background-color: #FFECF9;

color: #000 !important;

}

.characters .tag {

background-color: #E8FFE0;

color: #000 !important;

}

.freeforms .tag {

background-color: #DEEAEE;

color: #000;

}

3rd design =>

.tags-container {

display: inline-block;

border: 2px solid #f4dfe2;

border-radius: 12px;

padding: 10px;

}

.tags-container a.tag {

background-color: #f4dfe2;

border: #f4dfe2;

border-radius: 8px;

padding: 10px 12px;

margin-right: 4px;

display: inline-block;

}

.tags a.tag::after {

content: "ཐི༏ཋྀ";

color: #ffcb43;

text-shadow: 0 0 3px #fff;

margin-right: 2px;

}

.warnings .tag {

background-color: #EFD1D1;

color: #000 !important;

}

.relationships .tag {

background-color: #f4dfe2;

color: #FF8B35;

}

.characters .tag {

background-color: #f4dfe2;

color: #CE1983;

}

.freeforms .tag {

background-color: #f4dfe2;

color: #8d0f98;

}

[kateokate]

Winx skin

I'm very proud of the dashboard greeting gif (˶˃ ᵕ ˂˶)

https://github.com/KatherineKitkat/AO3-Site-Skins/blob/main/Winx%20Skin

https://github.com/KatherineKitkat/AO3-Site-Skins/blob/main/Winx%20Skin%20%28less%20gif%20version%29

Ps. The header looks wonky on desktop, the less gif version has a more suitable looking header (that will look very different on mobile as a consequence)

[kateokate]

I somehow got into making ao3 site skins in the last year or so, and funnily enough out of the dozen skins I made the last one ended up being the first one to be complete

https://github.com/KatherineKitkat/AO3-Site-Skins/blob/main/Zen%20ao3%20site%20skin

PS. This is made for mobile so it might look diffrent on desktop