How to use light mode and dark mode in Android Studio and Kotlin

Oscar de la Hera Gomez
Four flowers that represent Kotlin, Android, Jetpack Compose and Android Studio side by side. Beneath them sits the text “Light Mode & Dark Mode.”

A step by step guide on setting up and using dark and light mode in Kotlin and Android Studio.

Step One: Alter the Theme

A screenshot of Android Studio showing the Theme.kt file. Highlighted is the area where you set the colors for the light mode and dark mode.

In the Theme.kt file, change the colors associated with Light and Dark mode.

Step Two: Update Color Scheme Code

A screenshot of Android Studio showing the Theme.kt file. Highlighted is the updated theme code.

In the Theme.kt file, change the color scheme code to match the one below.

Step Three: Use the Colors

A screenshot of Android Studio showing the MainActivity.kt file. Highlighted are two uses of the MaterialTheme. Sample code on how to use them is found below.

To apply the colors use code similar to MaterialTheme.colorScheme.background or MaterialTheme.colorScheme.primary.

Step Four: Test

Two screenshots from an Android side by side. One in light mode the other in dark mode, confirming that the changes went through.

Run the app on a device to confirm the theme works.

Any Questions?

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.
delasign logo

Book a Free Consultation.

An icon of an email.

Click here to email us.

Fill in the details below to book a free consultation or to let us know about something else. Whatever it is, we are here to help.

How can we help you ?

Contact Details