Supporting Dark Theme

Android 10 introduced a system Dark theme setting, and modern apps should both support the system setting as well as let users override to their preferred theme. See how to add DayNight themes into your app on Android 10 and earlier versions of Android, and then let your users decide whether to follow the system setting. You'll also learn how to go to a dark theme in battery saver mode. By Joe Howard.

Leave a rating/review
Save for later
Comments
Share

Learning path

This is part of the Android UI & UX: Beyond the Basics learning path. View path.

Who is this for?

Experienced Android developers eager to learn how to support Dark theme in their apps in both Android 10 as well as earlier versions of Android.

Covered concepts

  • Force Dark
  • DayNight and MaterialComponent themes
  • Following the system theme
  • Night resources
  • Support for pre-Android 10 devices and Battery Saver mode
  • uiMode configuration changes

Part 1: Supporting Dark Theme

01
Toggle description

Before using a DayNight theme, learn how to use Force Dark as a transition step to supporting Dark Theme on Android 10.

Toggle description

Switch from Force Dark to instead use an AppCompat DayNight theme, so that the themes will work on earlier versions of Android, and then a MaterialComponents DayNight theme.

Toggle description

DayNight themes support a "night" resource qualifier within which you can use styles to customize the views of your app when in Dark theme mode.

Toggle description

Let your user choose to override the system setting and pick either a Light or Dark theme, and then let them follow the system setting so that the app theme switches with the system.

Toggle description

Dive into the smaller details of supporting dark themes and polish your app in both Light and Dark modes.

Toggle description

Dark theme changes at the system level correspond to uiMode configuration changes. See how to let your UI manually handle the change to the system Dark theme setting.

Toggle description

Go back to automatically following the system Dark theme setting, and then adapt your app to follow the Battery Saver setting on versions of Android before Android 10.

Up next

Android & Kotlin
Animation with MotionLayout
MotionLayout is a ConstraintLayout subtype that lets you easily add animation to your user interface. See ... more

Instructors

Contributors

Joe Howard

Instructor

Adriana Kutenko

Illustrator

Over 300 content creators. Join our team.