Blog / UI Design

Can Dark Mode Really Save Energy And Be Better For The Environment?

Abstract motif

Author

Justyna Weronika Łabądź

Published

Read time

True or false? It's a little more complicated. Dark mode can be a greener solution that increases your battery life and reduces power draw, but only in particular conditions.

  • Display type. It depends on whether it is an LCD with a single backlight or an efficient OLED display, where each pixel is individually lit up as a tiny LED lightbulb.
  • Brightness. Using screen auto-brightness is more energy-efficient and can work almost the same well as the dark mode in smartphones.
  • Device type. Using a phone in dark mode, especially with an OLED display, draws less energy than a laptop or PC.

Learn when and how dark mode and background can impact lowering your energy consumption and become better for the environment.

Table of contents:

What is dark mode?

"Having turned to the dark side" is no longer associated only with the Force of Dark Jedi in the Star Wars movie. As the dark mode is becoming increasingly popular, software and application owners popularize this feature through their channels as a way to use less energy and the way to manage battery drain.

To be precise, dark mode isn't anything new. The history of computers began with "dark mode." Or rather a dark view because there was no other option and mode at this time. Initially, all computer screens and their operating system were designed on a dark background with white or greenish letters. It didn't last long because the computers' dark theme was replaced with the brighter one and displayed black text on white. This switch was inspired by other papers and books that work, in most cases, with text on a white background. However, what is worth mentioning, is that those first computers with Cathode Ray Tube (CRT) monitor required less energy.

That's why, when in the early 2000' Google wanted to celebrate Earth Day, they changed the company's famous white interface to black and inspired other web creators who applied the exact solutions to their design. But it was at the time of the previously mentioned CRT monitors.

Now, 20 years later, technology evolved - but it doesn't mean, unfortunately, that it has become more environmentally friendly. However, the most popular while thinking about energy savings on the web still stays dark mode feature and improving user experience under special conditions of the device's usage.

Old style Cathode Ray Tube monitor with black display and green signs.
Cathode Ray Tube (CRT) monitors from the past with characteristic black screens with green signs turned out to require less energy.

How does the dark mode work?

Dark mode is a feature that allows users to switch the color scheme of a device or application from a light color scheme to a dark one. When this mode is enabled, the background display becomes black or very dark gray, and the text and other elements are displayed in lighter colors. The primary goal of the dark mode is to reduce the strain on the user's eyes and to make the display more comfortable to view in low-light conditions. However, it can also extend the battery life with OLED or AMOLED displays, while they use less power to display darker colors than lighter ones.

What is the difference between dark mode and dark background?

There is a difference between dark mode and dark background on the website. The dark background is more connected with the aesthetic side of the UI, even when users often change the mode to the dark for aesthetic reasons. However, when web designers create a website or an app with a black background, they do it accordingly to their strategy and different goals.

They can be, for instance:

  • Dark color palettes can fit more into the brand's image and create specific visual effects. For example, dark backgrounds are popular on streaming platforms like Netflix, Disney+, or HBO Max, which evoke the feeling of intimacy and remind the dark of space during cinema screenings in movie theaters.
  • Dark backgrounds are also popular when thinking about the accessibility of the website. As a darker or high-contrast mode, it can serve people with visual impairments and improve the readability of the content in some cases.

To sum up, dark mode is a specific feature that allows users to switch the color scheme of a device or application. In contrast, a dark background is a specific visual element that can be used in conjunction with other design elements.

In terms of saving energy and the environment, both can work the same but are only used on OLED and AMOLED displays, which I will elaborate in the following paragraphs.

Why is dark mode so popular?

In recent years dark mode has become increasingly popular. First, this is because it represents a new approach to technology and features that deliver more physical and psychological benefits.

  1. First, dark themes became promoted through media, which described them as a solution to overcome the discomfort of using devices in low light conditions. Today, it is a popular or even classic feature on many apps and websites, including Netflix, YouTube, Twitter, and Facebook. It can also be easily applied through web browsers like Google Chrome or Microsoft Edge.
  2. While people started to use devices like computers and smartphones for more time, even at night, when they turned off lights to watch videos or browse social media, they could experience the feeling of eye strain. They quickly noticed that bright or white backgrounds harshed their eyes when looking at screens for a longer time. Blue light emitted by them also messes up their circadian rhythm and makes it hard to fall asleep. Before devices with displays, the most significant source of blue light was natural sunlight. However, researchers found that displays can also generate it, and watching it at night can suppress melatonin secretion that helps to fall asleep.
  3. This approach also matches modern society's growing dependence on devices. It impacts the need to extend the battery life when we use more and more devices. In some cases, the dark mode could come in handy, while sometimes, it can help to save battery power.
  4. Dark mode has also become trendy. Many people prefer to use it as an interface aesthetic that can give a device or an app a sleek and modern look.
  5. Lastly, dark mode is also popular from a psychological point of view. Users love to have a choice on how they experience the web and apps. It gives them the feeling of customization. With the theme switched to dark, they can feel that display views become more personalized.
The button ON with description Dark mode.
Users often turn on the dark mode in dark rooms to reduce eye strain.

Does dark mode actually save energy?

When dark mode appeared and became popular in digital products like websites and applications, many people switched to it, believing that it could help to save energy and, in this way, extend the battery life. However, only some users know it could work only on particular displays - OLED and AMOLED. LCDs, more popular in communication technology, may not necessarily be as energy efficient as they are supposed to be.

What are the differences between those displays?

LCD display

LCD stands for Liquid Crystal Display, invented in 1964 by George H. Heilmeier. It is a display technology that uses liquid crystals to create an image. LCDs have been widely used in various devices, including smartphones, tablets, laptops, TVs, and digital signage, for many years. An LCD consists of several layers of material, including a layer of liquid crystals. However, many LEDs are used in the backlight, which is the central part of the equation. As long as your screen is on, every LED light consumes the same amount of power. It doesn't matter what color it is displayed on the LCD because pixels don't drain any power here. In this case, the backlight's brightness determines the display energy usage.

OLED and AMOLED display

OLED stands for "organic light-emitting diode," and AMOLED is a shortcut for "active-matrix organic light-emitting diode." They both are types of display technology that use carbon-based, organic materials to create an image. However, while OLED displays use a simple matrix of electrodes to control current flow through the organic materials, AMOLED displays use a thin-film transistor (TFT) matrix. The key difference is not only the build of the matrix but also brightness, viewing angle, and, what may interest us the most, their power consumption. OLED is more energy efficient than AMOLED, which requires an additional TFT matrix to control the flow.

To sum up, an important difference between LCD and OLED screens is the use of individual LED light bulbs in OLED instead of a single backlight in LCD. The result is better picture quality, but dark colors also use less electricity since less is illuminated on the screen. Pixels light up only when needed, so the power draw of OLED displays will be smaller than others.

How about computer screens? Finding a laptop or monitor with an OLED display is still not common because this technology is quite expensive for large formats. So, of course, in most cases, users can switch to night light settings in Windows or other systems, but they should rather do it to filter out blue light and reduce eye strain than save energy.

What is the ability to save energy with OLED?

In 2021 researchers from Purdue University tested how much OLED displays reduce energy (research from 2021). They tried out several smartphone models with the Android system, like Pixel 2, Moto Z3, Pixel 4, and Pixel 5. Despite not analyzing Apple phones, all of the devices since the iPhone X (2017) feature OLED displays, so the findings are likely to be similar.

Purdue researchers Pranab Dash and Charlie Hu were interested in discovering how much energy does dark mode really saves on Android battery. They examined energy consumption by a few of the most popular smartphone apps like calculator, Google Maps, YouTube, regular phone usage, and Google News App on different brightness levels. After one minute of testing each of those apps in the dark mode at 100 % brightness and the adaptive one, they measured and noted the results.

They discovered that OLED displays consume between 44% and 73% of the total phone's power during light mode at maximum brightness. However, since most people don't use their screens at full brightness, the study also measured the impact of brightness on energy consumption. It gave a surprising battery life figure. Changing from light to dark mode reduces the phone's power consumption by 42% at 100% screen brightness. When the brightness level is 50%, switching from light mode to dark mode saves 9 % of the battery, and when the brightness level is 30%, the saving is only 3 %.

According to researchers, dark mode on an OLED smartphone will save 3 to 9 percent of the power when used at 30 to 50 percent brightness, usually in line with the automatic brightness level.

Table shows power reduction when switching light to dark mode at different screen brightness levels.
Table 1. Power reduction when switching from light to dark mode at different screen brightness levels on Pixel 2 example. X/Y: display power reduction / total phone power reduction. Research by Charlie Y. Hu and Pranab Dash, "How much battery does dark mode save?: an accurate OLED display power profiler for modern smartphones", June 2021

In summary, the higher the brightness when switching from light mode, the greater the battery savings, both on iOS and Android. However, you will unlikely notice any difference even if you use the dark mode in darkness unless you need it to be at high brightness, such as on a sunny day.

The benefits of dark mode

If used properly, there are many benefits to using dark modes on your phone or computer:

  • Undoubtedly, you can reduce eye strain and protect your sight when you watch displays for a longer period and in a dark room.
  • It also improves your sleep by reducing the amount of blue light your screen emits, which is known for interrupting melatonin secretion that helps you fall asleep.
  • It makes it easier on your eyes to see in bright light, which means that it can help you see better when you're outside or near windows where light from outside is shining through (this is especially important for people who wear glasses).
  • When you turn on dark mode on the OLED display, you can save battery life on your phone or laptop, especially when you are used to maximum brightness.
  • Less power when displaying also means you extend your battery life.
  • Due to the power-saving of dark mode, you save electricity needed to power your devices and their activities and also generate less carbon footprint. So, even in small amounts, you become more ecological and planet-friendly. And as we believe in Dodonut, every little action matters in improving the world.
  • Web and app developers can benefit from dark mode because applications that require syntax highlighting can be easier to see with light-on-dark themes.

When you provide a dark mode or dark background as a digital product owner, you can encourage your users to make more sustainable decisions and make your business more sustainable too.

The battery with full power.
On phones or laptops with OLED displays, you can save battery life by switching to dark mode, especially if you're using them at maximum brightness levels.

When and why you shouldn't use dark mode?

There is a dark side of dark mode, and we can mention several reasons why and when you shouldn't change light mode to dark mode.

  1. When you have LCD devices and think about saving the phone's battery, switching from light to dark mode makes no sense. They will always require a backlight that lights up every pixel simultaneously. Instead, you can focus more on the auto-brightness that can emit lights only in the needed amount, so it also saves energy when customized to conditions. It also applies to PC and laptop users. Adopting dark mode to their user interface doesn't make a difference in energy saving unless you have a particular laptop model with an OLED screen (so far, it's still not so popular for those devices)
  2. There was a reason that someone invented a white screen with dark text. Of course, it was inspired by other texts created on paper and books. The human eye is used to the white background because our eyes naturally work well in daylight. It is not natural to see things at night correctly and easily. Therefore the white text on a black background can make the text harder to read.
  3. Dark mode and background can be difficult for people with astigmatism. What's more important, there is a high number of people who can even don't know that they have astigmatism (approximately 50% of the population suffer from it). A person with astigmatism has difficulty reading white text on black rather than black text on white. Light levels play a part in this: a bright display (white background) causes the iris to close a bit more, reducing the deformation of the lens. A dark display (black background) causes the iris to open more, creating a much fuzzier focus on the eyes due to the deformation of the lens.
  4. Dark modes don't serve well for people with dyslexia. It can be difficult for them to read white text on a black background. Many dark themes use total contrast. There is a consensus that dyslexics prefer lighter backgrounds with appropriate contrast ratios. This may not be universally true because individual preferences vary based on many factors.
  5. Dark mode can be bad for your productivity. As the research shows, it may lower the readability of the text, findability of errors, and slow down the reading time.
  6. If you don't like to implement dark mode to your device because you simply don't like it, don't force yourself to do it. Your comfort is much more important. And if you want to save power and the environment, there are several other ways to do it.

Dark mode and accessibility

How about dark mode and accessibility? Dark mode can potentially make websites and apps more accessible for some users, particularly those with visual impairments, difficulty seeing, or who experience eye strain when looking at bright, white screens. Dark mode can reduce the amount of light emitted by a display, making it easier to read the text in high contrast and navigate menus and interfaces, especially in low-light conditions.

However, it's important to note that the benefits of dark mode will depend on the specific needs and preferences of the user. Some users may find that dark mode makes it easier to see and read text, while others may prefer the look and feel of a light color scheme. It's also essential to ensure that any text or elements displayed in dark mode are still legible and easy to read.

Overall, while dark mode can potentially make websites and apps more accessible for some users, it's important to consider the needs and preferences of the target audience and to ensure that the design is accessible and easy to use for all users. What we implemented at Dodonut's website is the offer to choose between three different color modes of the website:

  • Light mode (which is light gray)
  • Dark mode (which is dark gray)
  • High-contrast mode (prepared specially for users with low vision)

What is crucial for us at Dodonut is to let the users decide which mode and background better serve them by providing a website with a mode switcher, which we implemented in our case.

Dark mode and dark theme in sustainable web design

So, if the dark mode does save electricity and become genuinely more sustainable? It can be, but as we examined earlier, only on OLED and AMOLED displays, and the impact will be more significant with the highest brightness of the display (but we still suggest relying on the auto-brightness feature, which is more often more effective). As we know from the research above, dark mode saves only 3%-9 % of power, assuming that our OLED displays work on auto-brightness. However, when users require higher brightness in dark mode, for instance, about 100%, in dark mode, he or she saves an average of 39%-47 % of the power, so almost half of the battery.

LCD users instead should find another way to achieve longer battery life, like turning off the apps or not using features at particular moments, like WIFI or Bluetooth. Still, those actions can be successfully applied both by OLED display users.

So, does it make no sense to apply dark modes to designs, devices, and their features to save the environment? Of course not. At Dodonut, we make users and web creators aware that even small actions, multiplied by many people, can help make a difference. Even if now OLED screens are not so popular in every phone and are too expensive for more computer displays, that doesn't mean that in the future, this technology will become more achievable and popular in tech solutions. What's also essential is that there are various shades between white and dark or black, so designers can see that their website can contain other colors that are more sustainable for the background between them. Check out what we wrote about colors here in the article.

Dodo bird meditating and becoming more mindful and sustainable.
The dark theme can be treated as one of the solutions for creating a more sustainable web design, although not the only one.

What can you do more to save battery life and reduce energy consumption?

Conclusion

Overall, while dark mode works only in particular settings and may be able to save some energy on certain types of displays, it is not a guarantee. It can be one of the ways to draw less power when displaying apps and websites on screens, and only in OLED and AMOLED displays. The best way to save energy on a device is to use it efficiently, such as by reducing the brightness of the display and closing apps when they are not in use or simply reducing their usage.

As web creators, we can encourage our users to try out night light settings. However, implementing a holistic approach to sustainable web design would be more valuable. Few of the ways to save energy and the same environment through sustainable web design we mentioned in the article "How to design a sustainable website?". We can optimize content (images, fonts, videos, animation), create well-working navigation, improve website performance, and provide the best user experience, among many others.

From the user perspective, we can behave more responsibly in our web usage. Every search and surfing web causes a carbon footprint, which is inevitable, but it's up to us to use a mindful approach that makes a difference and supports climate movement.

References

See all dodonut.com references

This article emits ~0.04g of CO2.

Newsletter

Let’s create
digital together

Latest Articles

Discover ideas and insights from our journey to make the web greener and create better digital experiences.

See all 13 articles

Create website that works for both people and the planet.