ao3 code
This tag belongs to the Additional Tags Category.
Parent tags (more general):
This tag has not been marked common and can't be filtered on (yet).
Works which have used it as a tag:
-
Newspaper/Magazine Article Template by deathbymistletoe
Fandoms: No Fandom, Original Work
21 Jul 2024
Tags
Summary
A simple template for the HTML/CSS of a mock article for fake newspapers and such.
Series
- Part 1 of Frontend Shenanigans
-
Tags
Summary
Another HTML/CSS template! This one for a basic chat log including usernames, optional times, and (obviously) message contents.
Series
- Part 4 of Frontend Shenanigans
-
Tags
Summary
A short & sweet guide to a work skin (and the associated HTML) that allows readers to choose from a list of given names for a character and select which one they want the work to use.
Series
- Part 3 of Frontend Shenanigans
Bookmarks which have used it as a tag:
-
Tags
Summary
Primarily just where I share work skin code and discuss ways to improve the Ao3 experience, including:
- Twitter and Instagram like posts
- Non iOS messaging systems
- Avatar and image formatting for script formats.
- Search engine interfaces
- Documentation on AO3 Site SkinsSeries
-
AO3 Work Skins/Tutorials by CodenameCarrot, La_Temperanza
Fandom Deadpool (Comics), Deadpool - All Media Types, No Fandom, Star Trek, Star Trek: Starfleet Academy (TV 2026), Undertale (Video Game)
07 Feb 2026
- Words:
- 93,564
- Works:
- 21
- Bookmarks:
- 4,423
-
The Choose Your Own Adventure Guide to Choose Your Own Adventure Fics with AO3 Limited HTML by 0_0_MLM
Fandoms: No Fandom, Fandom - Fandom
30 Jan 2024
Tags
Summary
Create single chapter interactive choose your own adventure fics—no links required! Just some creative CSS.
Series
- Part 3 of Tech Tutorials for Ao3
-
How To Change Text on AO3 When the Cursor is Hovering Over It (Or Clicked on Mobile) by La_Temperanza
Fandoms: No Fandom
22 May 2017
Tags
Summary
This a tutorial/live example on how to have text change or appear once a cursor is hovering over it. Helpful for pop-up spoilers, language translations, quick author's notes, etc.
Series
- Part 15 of AO3 Work Skins/Tutorials
-
Fonts, and colors, and work skins, oh my! by Charles_Rockafellor, 𝖀𝓷ᶦ𝕔ⓞðə E Ⓜ️🅾️j̵͍̟̝̝̖̮̓ͭͨ̂̐̚ℹ️ (Charles_Rockafellor)
Fandoms: css - Fandom, Work Skins - Fandom
24 Jan 2021
Tags
Summary
Explains:
● how to make a work skin;
● how to view fics' work skin rules;
● how to colorize text and circle words and highlight backgrounds (examples in head-note), and change and resize your fonts;
● how to turn all links blue-underscore automatically;
● the CSS code for diacritics to render properly, e.g.: “ầ” & “ồ” (with diacritics not superimposed), or “ị” (with underdot directly beneath, not kerned to the left), without breaking words such as “gầu” or “vịt” (using a monotype font for these letters would create gaps to each side of the ầ or the ị). Head-note has corrected examples;
● Site Skin addenda to block / shrink tags, and block authors / works;
● even a quick way (code included) to simply make a Site Skin so that you can read everything in your font of preference!Full code is included.
I read, appreciate, and reply to all of your comments — they're always welcome!
𝑫𝒐𝒏'𝒕 𝒇𝒐𝒓𝒈𝒆𝒕 𝒕𝒐 𝑳𝒊𝒌𝒆, 𝑺𝒉𝒂𝒓𝒆, 𝒂𝒏𝒅 𝑺𝒖𝒃𝒔𝒄𝒓𝒊𝒃𝒆! ❤️
Series
- Part 5 of How to
-
Tags
Summary
Example and basic code for making some text hidden or optional on Ao3 using details and summary tags
Bookmarked by sora_grey
02 Oct 2024
Bookmarker's Tags:
Bookmarker's Notes
Useful for when my author’s notes spiral wildly out of control, because sometimes there’s a lot of random information in my fics.
sora rambles
or, I can actually write multi-chapter fics and insert any relevant information within a specific chapter and then hide them when necessary.
or, I can finally revise my old works because the beginning/endnotes for some of them are really fucking long. 🤦🏻♀️😬
-
Tags
Summary
Work skin for different types of found documents, for people who are into that kind of thing.
Update 1 December 2022: Added parameters for links within div sections. Previously, applying this work skin on top of the Reversi site skin could make links difficult to read.
-
Tags
Summary
Embedding tutorial
- Language:
- English
- Words:
- 212
- Chapters:
- 1/1
- Collections:
- 1
- Comments:
- 4,061
- Kudos:
- 8,351
- Bookmarks:
- 5,295
- Hits:
- 393,037
Bookmarked by AzureDiamond
23 Jan 2026
Bookmarker's Tags:
Bookmarker's Notes
Super Awesome Learning How to Embed Place
leftennant -
Tags
Summary
A quick guide on how to code and use the hover to translate workskin. This feature allows readers to hover on a word or image and have it change into the translation.
If you use this and want to link back so other people can use it, too, that'd be awesome.