Guide: Appearance and UI

Back to Intro

WAFRN offers you many options to change the way you see and experience the site. This guide will focus on the Appearance and User Interface settings available on WAFRN.

This guide was last updated on 1/9/2026, corresponding with desktop web build v2026.01.03-DEV.

Themes

The WAFRN sidebar, showing the Settings button, the More button, and the Woot button. Then, at the bottom left, a square has been drawn around the "sun" icon and the "palette" icon.

The standard WAFRN interface includes two basic appearance settings: light/dark mode and theme options. The sun icon allows you to choose between Light mode, Dark mode, and Auto. "Auto" will change to Light or Dark mode depending on your system settings.

The palette icon allows you to select one of a list of themes.

The cursor is hovering over the "Programmer's Favourites" category in the theme menu, which shows themes named Dracula, Catppuccin Latte, Catppuccin Frappe, Catppuccin Macchiato, and Catppuccin Mocha.

Some of the themes are basic variants on the default WAFRN theme, changing the colors but keeping other features mostly the same. For example, this is the "Green" theme under the "Default Theme Variants" submenu.

A wide screenshot of the WAFRN Dashboard on the "Green" theme. The previously-white background has been made into a soft yellow-green pale color, and all of the gray or red accents have been turned green instead. The "Woot" button is a dark yellow-green to dark pine-green gradient.

Some change the site dramatically, such as the "Aqua" theme under the "Computery themes" submenu.

A wide screenshot of the WAFRN Dashboard on the "Aqua" theme. The sidebar has a brushed metal background, while the body of the page has a soft blue shapes background. Posts have a white (or very light gray) background, and the buttons on the posts are now rounded and shiny, like Mac OS buttons. The app.wafrn.net logo has been replaced with a glass-like "W" that says "WafrnOS X".

Some themes look better in light mode rather than dark mode. When you select the theme you want, WAFRN will select the appropriate "light" or "dark" mode setting to pair with it. You can always change this if you prefer it a different way.

Appearance

To find more appearance options, you can go to the Settings menu, and navigate to the Appearance and UI submenu.

There are two cursors shown, showing sequential steps: First, clicking on "Settings" in the sidebar, then clicking on "Appearance and UI" in the Settings menu. To the right, the Appearance and UI submenu appears, showing options for a "Theme" dropdown, A "Light/Dark mode" dropdown, and "Additional style modes" dropdown. There are also checkboxes for "Use custom styles from user blogs" and "Ask to use custom styles from user blogs," which are both checked.

The Theme, Light/Dark mode, and Additional style modes are all the same as the options in the sidebar. You can change these settings in the sidebar, or in the settings, at any time.

WAFRN users can also create custom themes using CSS. Although custom themes retain the functionality of normal WAFRN, they can sometimes be difficult to read. By default, WAFRN will ask you if you want to use the custom CSS, where it exists. If you would prefer the option to use your own themes to view another person's page, you can leave these settings unchanged.

To learn more about making your own CSS theme, check out the Profile Customization guide.

User Interface

The User Interface subheader, with three fields below. One is a dropdown field titled "User interface language," with "English" selected. Help text below says, "Wafrn is translated into various languages by volunteers. Check out Source to help!" There is also an expandable box for "Woot reply bar icon order" and "Woot actions menu button icon order". The Action Menu button box is expanded. Help text says, "Items shown in the woot actions menu. Some items are shown depending on whether you are the wooter." There are options to show or hide Quote, Rewoot, Reply, Bookmark, Like, Edit, and Delete, as well as options to drag and rearrange each one.

In this section, you can change the User interface language to any of the available translations. You can also change which buttons appear on posts and the action menu, and the order in which they appear.

Classic Options

The Classic Options subheader of the Settings menu, with four checkboxes below. The options read "Force classic logo," "force classic video player," "force classic audio player," and "force classic media view (vertical)".

This section allows you to select alternate options for the logo, video player, audio player, and media view.

Animations and Sounds

The Animations and Sounds subheader, with one expandable box and one normal checkbox. The "Confetti" box is expanded to show more options. "Disable confetti effects when performing certain actions" is unchecked. "Enable confetti when you receive a like (PvP)" is checked. Confetti multiplier, a number entry field, is set to 1, with help text below saying "Multiplies confetti amount. High amounts can freeze your browser!". Flat confetti is unchecked, with help text saying "Disables the 3D effect of confetti". There is also a button to test the confetti effects of different actions. You can select the type you want to test, then click "Under Mouse" or "Screen sides" to test it. Finally, outside the confetti box, there is a checkbox to "Disable sound effects when performing certain actions," which is checked. Help text says, "By default, a sound is played on like, react, woot, edit, and rewoot."

When you perform actions, your WAFRN interface can blast particle confetti onto your screen. This section allows you to control how the confetti appears, where it appears, and when it appears.

WAFRN also has sound effects! You can disable them in this section.

Back to Intro