8 Tips for Perfect Dark Theme UI
β‘ 8 Tips for Perfect Dark Theme UI.
-
Author: @the.dsgnr
-
Inspired by Google, why?
Well, because Google has the most detailed overview dedicated to Dark Themes UIs (using its products as examples).
βββ
Typos and other mistakes (sorry I did this on a rush πβοΈ
Tip 3 - the examples are on the wrong order)
Tip 7 - Text opacity = the medium emphasis in demo design is mistakenly written as 87% and not 60%.
Tip 8 - It should be : Shadows on dark themes donβt serve..
βββ
Dark Theme has many benefits:
β’ It can reduce power usage by a significant amount (depending on the deviceβs screen technology).
β’ Improves visibility for users with low vision and those who are sensitive to bright light.
β’ It makes it easier for anyone to use a device in a low-light environment.
βββ
Dark Theme is recommended to be provided as an option:
β’ Light
β’ Dark
β’ Set by Battery Saver
β’ Set by system settings
βββ
π€ When to use it:
β’ When dark goes along with brand colors
β’ To reduce eye strain
β’ To support visual hierarchy
β’ To save energy, on pages that are used for long periods of time.
βββ
βDo you think every app needs a dark theme, or is it just another trend? Let me know in the comments below.
β
π© Looking for a Website or App design/development? Please write via DM.