HTML
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).
Bookmarks which have used it as a tag:
Pages Navigation
-
Mimicking Twitch Chat for Fics- Some Twitch Chat Workskins by Ultraviollett
Fandoms: Video Blogging RPF, Fandom - Fandom, Real Person Fiction
04 Jul 2022
Tags
Summary
A CSS workskin to mimic twitch chat. I couldn't find any so I decided to create one myself!
Series
- Part 2 of AO3 workskins
-
Tags
Summary
Documentation/Examples for the CSS workskin and HTML code for a Wikipedia article inspired layout to use in your mixed media works.
Created with help from Nautilusopus and DarthTofu.
-
Skin for Putting Music Indicators in Your Fic by SpookyTesting (FierySprites)
Fandoms: No Fandom
27 Apr 2022
Tags
Summary
A work skin for inserting stylized music links into your fic, ala Super Smash Bros.’ music labels at the start of each match.
-
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
This is a tutorial/live example on how to make large images fit on mobile browsers but remain normal size on desktop browsers.
Series
- Part 18 of AO3 Work Skins/Tutorials
-
Dark Mode Skin That Makes Ao3 Look Like Discord by trx
Fandoms: Archive of Our Own, AO3, css - Fandom, Skin - Fandom, Skins, dark mode
05 Feb 2025
Tags
Summary
CSS script to make your Ao3 look like Discord!
This is also a Dark Mode so Ao3 stops hurting your eyes at night. -
How to Mimic Letters, Fliers, and Stationery Without Using Images by La_Temperanza
Fandoms: No Fandom
27 Jul 2017
Tags
Summary
This is a tutorial/live example on how to mimic the look of letters, fliers, and stationery (as well as other forms of written media) without using images. For all your epistolary fic needs.
Series
- Part 17 of AO3 Work Skins/Tutorials
-
Tags
Summary
This is a live example of how an author can create linked footnotes in their work with only a little bit of HTML and no workskins required. This is best viewed by clicking "Entire Work". While I've included the actual coding in bold and italic once you click "Hide Creator's Style", there's a more detailed explanation here.
EDIT 6/28/17: The third chapter now shows how to use anchor links as an index/table of contents.
Series
- Part 6 of AO3 Work Skins/Tutorials
-
How to Mimic Author's Notes and Kudos/Comment Buttons by La_Temperanza
Fandoms: No Fandom
20 May 2017
Tags
Summary
Anonymous on tumblr: do you have a skin that would mimic the author’s notes and review/kudos buttons section from the end of a fic? the desired effect being that the fic could go on after the “end” of the fic, so after the author’s notes and review/kudos buttons
Here's a tutorial/live example to do just that, with some of the buttons actually functioning. I'll explain more inside!
Series
- Part 14 of AO3 Work Skins/Tutorials
-
Tags
Summary
As of April 2016, The database that stores works on A03 does not allow emoji. If you try to add an emoji it will end your story there. Any words after the emoji? Poof. Gone. This is a known, if poorly advertised, issue with the archive.
There are some workarounds; you can find them in: How to Make iOS Text messages on A03. But here? Here is for ALL THE EMOJI*.
10 chapters of emoji tables, each with the HTML for putting the emoji into your work and the CSS for putting it into your workskin. Copy-Paste baby. Copy-Paste.
*Does not contain the 2016 Unicode release. You'll have to come up with the code for pickle yourselves.
(Note, because this is 10 chapters of emoji tables, here is a link to the Index Tables (chapter 1) to speed up load times and reduce confusion if you have preferences set to "entire work.")
Series
- Part 11 of AO3 Work Skins/Tutorials
-
Tags
Summary
This is a live example of my AO3 skin that allows the author to recreate the look of lined notebook paper in their work. To learn more about it, you can find the tutorial here.
Series
- Part 7 of AO3 Work Skins/Tutorials
-
Tags
Summary
An exciting new new way to format pesterlogs in HTML!
Try it out: https://flaringk.github.io/homestuck5plus/
-
Mystery Work
Part of jail time!
Summary
This is part of an ongoing challenge and will be revealed soon!
-
Tags
Summary
A mock-up of a fake article about a TV series, with CSS and HTML code and a brief guide on how to use it.
-
How to Mimic Author's Notes and Kudos/Comment Buttons by La_Temperanza
Fandoms: No Fandom
20 May 2017
Tags
Summary
Anonymous on tumblr: do you have a skin that would mimic the author’s notes and review/kudos buttons section from the end of a fic? the desired effect being that the fic could go on after the “end” of the fic, so after the author’s notes and review/kudos buttons
Here's a tutorial/live example to do just that, with some of the buttons actually functioning. I'll explain more inside!
Series
- Part 14 of AO3 Work Skins/Tutorials
-
Tags
Summary
For everyone who wants to use a language in their fic, and provide a translation, making it friendly for mobile and desktop, and something that's fairly easy without needing every possible translation included in the workskin itself, here you go.
-
The Nice and Accurate Guide to Footnotes by Vigs for fersh
Fandoms: Good Omens - Neil Gaiman & Terry Pratchett, Good Omens (TV)
10 Aug 2019
Tags
Summary
If you're writing fanfiction for Good Omens, you may find yourself wanting to include footnotes.
But html can be confusing. What can you do?
Read this guide to find out!
-
Fonts, and colors, and work skins, oh my! by 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 2 of How to
-
How to Make Invisible Text (That Can Be Highlighted) by La_Temperanza
Fandoms: No Fandom
21 Oct 2015
Tags
Summary
This is a live example how to make invisible text that can only be seen by highlighting the text. Tutorial is included in text, and you can always leave comments about questions you may have.
MOBILE USERS: Sadly, this probably won't work for you, since highlighting in a mobile browser is different than web. I've tried correcting this, but have yet to find a solution.
Series
- Part 4 of AO3 Work Skins/Tutorials
-
How to make a News Website Article skin on Ao3 by ElectricAlice
Fandoms: Archive of Our Own, Fandom - Fandom
26 Dec 2019
Tags
Summary
Live example and tutorial for a news article extract that include website header, fake social media buttons, title and author of the article.
Series
- Part 1 of CSS code scripts for Ao3