Reading Time: 6 minutes

Dark UI in codingOnce the exclusive preserve of computer programmers and engineers, dark mode (also known as ‘Dark UI’ or ‘dark theme’) has gained popularity in recent years.

What is Dark UI ?

This is where text and other content is displayed on black or dark backgrounds. For gaming, TV programme and music streaming platforms such as Spotify, it’s often the favoured design option.

Does it Improve the User Experience ?

Web trends come and go. Innovations which improve usability add value by encouraging engagement. So, does Dark UI improve the user experience?

The short answer is… it depends.

When’s Good to use Dark UI ?

  • To evoke luxury: for image led sites with minimal text.
  • To reduce eye strain: in predictably low-lit environments e.g. gaming, TV and music streaming services.
    • Programmers often say Dark UI reduces eye strain when writing code. To work, you must draw the curtains and wear a dark hoody. Hoody not essential, but it adds to the mystique.

When is it Best to Avoid having a Dark UI ?

For many sites, with the following factors, it’s best to stick with a traditional Light UI (light background), for usability reasons.

  • Websites with more than a few words of text: for many, reading paragraphs of text in dark mode slows reading and strains the eyes.
  • Websites with many different elements: e.g. text, images, forms, data tables, dropdowns. Dark backgrounds reduce options to vary colours to make different elements standout.
  • Predictably well-lit or outdoor environments:
    • In a bright office, dark mode is likely to cause eye strain.
    • Try reading an ATM screen with a Dark UI, with the sun glaring. Nightmare!

Dark Mode: Where it Works & Why

In design, it helps to understand why certain decisions are made. There is often a logical explanation, no more so than with Dark UI.

Visual Comfort
In low-light environments, Dark UI can be easier on the eyes, as it reduces the overall screen brightness. This can help reduce eye strain and fatigue for some users.

There is also minimal reading normally required.

Visual fatigue
This is long established. For instance, there’s a research paper supporting this back in 1988 (see link to ‘Reading from Paper versus Reading from Screen’).

This paper also cites earlier studies in 1986 from Cushman & Gould drawing the same conclusions. In 6 45-minute work periods, they compared ‘negative polarity’ (Dark UI – in this case light green text on a dark green background) vs positive polarity’ (Light UI).

There was ‘faster reading from dark characters on a light background’. Qualitative information gathered confirmed increased eye strain with negative polarity.

They were also able to rule out other factors such as screen orientation, screen flicker etc.

It’s all about light conditions
Dark mode doesn’t directly reduce eye strain. Neither does light mode.

“In a dim setting, a bright screen has your eyes working harder. On the contrary, a dark screen in a brightly lit room will have the same effect.”
Retinal specialists, Empire Retina (link below ‘How Environment impacts Eye Strain in Dark Mode’)

So, dark screens in a low-lit room. Light screens in a well-lit room. In addition, the most important factor to reduce eye strain, is to maximise colour contrast. Light UI has higher colour contrast.

The only time Dark UI would always be preferable, would be for those who are sensitive to light.

dark UI Contrast Sensitivity and Age-Related Macular Degeneration

Contrast Sensitivity relates to the difference between two colours, shades, or tones. Studies show that there is a linear decline in contrast sensitiviy, when comparing those aged 20-30 years and those 50-80+. See below link to ‘Effect of age on contrast sensitivity’.

Dark UI has less contrast than Light UI. In bright environments, this adds additional eye strain.

Is your target audience more likely to be in the older age bracket, such as business owners? If so, having a site designed using Dark UI may encourage visitors to leave your site before getting in touch.

Dark UI late at nightThere Every Moment of the Day
The goal of every social media platform is to keep you on there from the moment you awake to the moment you want to get to sleep.

So, a Dark UI option is essential for getting you back for another session after receiving a new notification.

Especially for Business to Business sites, a dark mode is less essential, as mostly they tend to be viewed during the working day.

Arielle Pardes, Wired writes,
“Twitter, for example, found that users spent more time in its app when dark mode was turned on. You’re less likely to notice that your eyeballs have dried out from staring into your screen.”

Its crucial to remember though, dark mode is best for scanning, not deep reading. Hence its success with short snippets on social media.

See more on the link to Halo Lab: ‘Benefits of Dark UI’.

Further Reading

Reading from Paper versus Reading from Screen
Research study (Oct 1988) by A. Dillon, C. McKnight, J. Richardson
Read more

How Environment impacts Eye Strain in Dark Mode
Dr. Aizman – Empire Reina Consultants
Read More

Effect of Age on Contrast Sensitivity
British Medical Journal
Read More

Benefits of Dark UI
Halo Lab Blog post
Read More