Best AO3 Dark Skins (2026): Community Picks + How to Install
If you have an AO3 account and want a fully custom dark look — not just an on/off switch — a community-made "site skin" is the way to go. Here are real dark skins made by AO3 users, plus the exact steps to install one.
What Is an AO3 Skin, Exactly?
A "site skin" on Archive of Our Own is custom CSS that a logged-in user can apply to change how the Archive looks to them — colors, fonts, layout, icons, all of it. AO3 ships with a couple of built-in public skins (like the dark "Reversi" theme), but the far larger and more creative library comes from the fan community: people write and publish their own skins as regular AO3 "works," and anyone with an account can copy the CSS into their own profile.
How to Install Any Custom Dark Skin
The process is the same no matter which skin below you pick — you're pasting someone else's CSS into your own account.
- Open the skin's AO3 page (linked below) and copy its CSS code.
- Log in to your AO3 account, then select "Hi, [username]!" → My Dashboard.
- Select Skins from the dashboard menu.
- Click Create Site Skin.
- On the Create New Skin page, paste the CSS into the Write Custom CSS box.
- Give your skin a unique title (required — up to 255 characters).
- Click Submit to save it.
- Go to My Preferences, find Your Site Skin, and select the skin you just created, then click Update.
Real Community Dark Skins Worth Trying
A Dark Mode Site Skin for AO3!
by cherryblossom
A dark mode skin that "embraces the classic red" — black background, white text, and red/grey accents that echo AO3's own branding rather than replacing it.
Pastel Gradient
by tealtiam
A dark skin with low-contrast pastel gradients, custom stats icons, and color-coded tags — a softer, more decorative take on dark mode for readers who find pure black-and-white too stark.
Dark Mode Skin That Makes AO3 Look Like Discord
by trx
Exactly what it says: a CSS skin that restyles AO3 to resemble Discord's dark UI, described by its author as a way to make "AO3 stop hurting your eyes" at night.
Replace the AO3 Icons 2.0 [Site Skin]
by ZerafinaCSS
Not a full dark theme on its own, but a popular companion skin that swaps AO3's default icons for higher-resolution, flatter versions — available in a dark-mode-friendly color option, often stacked with one of the dark skins above.
You can browse the full library yourself in AO3's own AO3 Skins collection.
Skins vs. the AO3 Dark Mode Extension
| Community skin | AO3 Dark Mode extension | |
|---|---|---|
| Account required | Yes | No |
| Setup | Copy CSS, create skin, select it | Install, done |
| Visual customization | Very high (fully custom CSS) | Preset themes + adjustable brightness/contrast |
| Survives AO3 layout changes | Depends on the original author updating it | Maintained independently |
| Works logged out | No | Yes |
If you enjoy tinkering with CSS and want a very specific look, a community skin is genuinely great. If you just want dark mode to work everywhere on AO3 without an account or upkeep, the extension is the lower-maintenance choice — and the two aren't mutually exclusive if you want to compare them yourself.
Want Dark Mode Without the CSS?
No account, no code to paste — just install and read.
Add AO3 Dark Mode to Chrome — FreeFAQ
What is an AO3 skin?
An AO3 skin is custom CSS that a logged-in user can apply to change how the Archive looks to them — colors, fonts, layout, icons, all of it. Skins can restyle colors, fonts, layout, and more, including dark themes made by community members.
How do I install a custom dark skin on AO3?
Log in, go to My Dashboard, select Skins, click Create Site Skin, paste the skin's CSS into the Custom CSS box, give it a unique title, and click Submit. Then select it as your active site skin from My Preferences.
Are AO3 dark skins better than a dark mode extension?
Skins can offer more visual customization since they're built specifically for AO3's HTML, but they require an account, manual CSS setup, and can break when AO3 changes its layout. A browser extension like AO3 Dark Mode needs no account or CSS and works immediately, including for logged-out browsing.