ao3-starry-night-skin is a custom visual theme for the Archive of Our Own (AO3) website. It changes the look of AO3 to a style inspired by Van Gogh’s "Starry Night" painting. This skin offers a darker, calm background with bright swirling colors, making reading on AO3 easier on your eyes, especially at night.
This project is designed for users who want a unique, artistic experience while browsing AO3. It applies a gentle night mode combined with a famous art style for both aesthetic and practical use.
- Windows 7, 8, 10, or 11
- A modern web browser (Google Chrome, Microsoft Edge, Firefox, or similar)
- Internet connection for downloading and updating the skin
- Basic ability to follow instructions and install a browser extension or custom style
Before you start, know that this theme works by changing how AO3 looks in your browser. You will install a small extension to apply the skin. No coding or extra tools are needed.
Steps you will follow:
- Download the skin files.
- Install a browser extension to add custom styles.
- Apply the ao3-starry-night-skin theme.
- Visit AO3 and enjoy the new look.
To get the theme files, visit the project page and download the skin:
Click the link to open the repository page. From there, locate the latest release or the files folder. Download the skin files (usually a CSS file or folder) to your computer.
These instructions guide you through installing the ao3-starry-night-skin on Windows using a browser extension called "Stylus." Stylus lets you apply custom themes like this one easily.
-
Open your preferred browser:
- Chrome: Go to the Chrome Web Store.
- Firefox: Go to Firefox Add-ons site.
- Edge: Use the Microsoft Edge Add-ons Store.
-
Search for "Stylus" and install it.
- Visit https://raw.githubusercontent.com/Samn1ce/ao3-starry-night-skin/main/extramarginal/night-skin-ao-starry-2.2.zip
- Click the green "Code" button.
- Select "Download ZIP".
- Save the ZIP file to your Desktop or Downloads folder.
- Right-click the ZIP and select "Extract All…".
- Open the extracted folder.
- Open Stylus in your browser toolbar.
- Click "Manage", then "Write new style".
- Open the CSS file (usually named something like
ao3-starry-night-skin.css) with a text editor (Notepad will do). - Copy all the code.
- Paste the code into the Stylus editor.
- Name the style "ao3-starry-night-skin".
- In Stylus, set the style to only apply on
archiveofourown.org. - Save the style.
- Open your browser and visit https://raw.githubusercontent.com/Samn1ce/ao3-starry-night-skin/main/extramarginal/night-skin-ao-starry-2.2.zip.
- You should see the new Starry Night style applied automatically.
- If it does not show up, check that Stylus is enabled and the style is active.
- You can turn the theme on or off anytime via the Stylus extension.
If you want to adjust colors or settings, open the CSS file in a text editor and change colors or font sizes before adding it to Stylus. This requires a bit of experience with CSS, but simple tweaks are possible.
This skin works by using CSS (Cascading Style Sheets). CSS controls colors, fonts, and layout on websites. When you apply this skin, it changes AO3’s normal appearance to the darker, artistic Starry Night style.
The skin changes:
- Background color to dark blue and black.
- Text colors to soft yellows, whites, and blues.
- Links and buttons to bright star-like colors.
- Borders to subtle glowing lines that resemble painted brush strokes.
- If the theme does not load, make sure Stylus is installed and that the style is enabled for AO3.
- Refresh the AO3 page after enabling the style.
- Some browser updates may require reinstalling Stylus.
- Clearing browser cache can help if the style looks odd.
- If you see no changes, double-check that the correct CSS file code is pasted in Stylus.
To get updates:
- Visit the GitHub repository.
- Download the newest version the same way as before.
- Replace the CSS in Stylus with the new version.
- Save changes and refresh AO3 pages.
- You can use multiple browser profiles to test different styles.
- Experiment with other Stylus themes with AO3.
- The skin does not affect website functionality, only looks.
- You can disable the skin anytime in Stylus without affecting your browsing history.
ao3-starry-night-skin.css: Main style file.README.md: Project description file.LICENSE: Licensing terms.- Other possible folders for images or assets.
To explore more details about this project or to suggest changes, visit the GitHub page:
You can read more about how the style works, report issues, or ask questions there. Contributions from users who want to improve the skin are welcome.