Background

Users tend to complain about functional changes to web applications. They are used to doing things a certain way, and like consistency. However, users do tend to enjoy subtle changes to fonts, colors, and other theme related styles.

Why fresh styles look better

You know how phone icons change with every major version? The new icons always look better to me, but are they really better? No, they are just different and fresh. After you have looked at the same thing for many months, any change looks good. It’s as simple as that!

How often to change styles

Obviously, changing styles too frequently would be annoying to users and defeat the purpose. My opinion is that updating the theme should take place every 3 months to 1 year, depending on a few things:

How much time users spend on the app. The more often they use the app, the faster the styles will get old.

How visually dense the application is. Are we talking about a consumer website, or a complex data entry application that needs a 4K monitor? Generally, the more visually dense an application is, the more stable it should be, with less styling changes. By visually dense, I mean having a lot of components inside the viewport, generally with smaller font sizes and less padding. It is possible to have a complex webapp that is segregated into simple pages, and style changes would more likely be tolerated.

What to change

Some suggestions of what to change:

The font. There are a lot of amazing looking fonts out there. It is ok to change headings to a fun looking font, but make sure to keep the regular font somewhat normal and readable.

Colors. If the app has branded colors, this might not apply.

Text Styles. Heading sizes, letter spacing, boldness.

Elevation. Adding, removing, or changing the box-shadow will give the app a new look.

Borders. The border-radius is probably the best thing to change, because a rounded border has a completely different look than a square border.

Padding and Margins. Increasing the padding and margins of cards, buttons, and other components will usually make the app look better. But too much space will make it annoying to use since the user has to scroll more.

Implementing themes

If your implementing a new application, its good practice to start with multiple themes early on. By implementing multiple themes right away, you will force yourself to write more structured and reusable CSS code. If you wait too long, it will be a pain to implement themes.

While there are a lot of libraries available to help with theming, I prefer to simply use CSS variables.

Closing Points

If you properly separated out your theme from the rest of your styles, changing the theme is somewhat easy. If you didn’t… it might be pretty hard, and not worth the risk of causing side effects.

I am not advocating that the theme should only be updated every 3 to 12 months. Feel free to do enhancements at any point. My main point is that even if there are no features or bugs that affect the theme, it should be at least updated every 3 to 12 months to keep it fresh.