Dark Theme

Now my website has a dark theme on the desktop view. You can see there is a button with a moon icon at the bottom right corner of the screen. You can turn it on then the website will be into a dark theme immediately. Your setting is saved. The theme will stay the same whenever you return after closing the browser. Thanks to HTML5 Local Storage.

Today, the dark theme is a trend. It happens on websites, mobile apps, and even Windows or macOS apps. It is eye-catching. It has a lot of benefits especially reduced eye fatigue and using small amounts of electricity.

You can see from the video above that the impact of using a dark theme on the iPhone is beneficial, especially for the battery. All my devices are always on the dark theme anyway. You can visit Material Design - Dark theme as a reference to design the UI for the dark theme.

The base theme of my website is light. The dark one is not available on the mobile view. But there is the AMP (Google Accelerated Mobile Pages) version to bring the best user experience. Feel free to put a comment for this article on my Twitter. Maybe I will set the dark theme as the base one for my website permanently.

Comments