Dark mode has become a beloved feature for users. However, simply inverting a light mode design is wrong. Dark surfaces should have elevation layers: 0dp → #121212, 1dp → #1E1E1E, 2dp → #232323, and so on. Shadows are not darkened — slightly lighter overlay colors express elevation instead.
In typography, pure white (#FFFFFF) fatigues the eyes — #E8EAED or rgba(255,255,255,0.87) is better. Colors need to be reworked for dark mode too: the same accent color is recommended to be saturated in light mode and lighter in dark mode. CSS prefers-color-scheme and the color-scheme property simplify implementation.
Our courses on this topic