Dark Mode & Dynamic Color
Adapt colors to system and wallpaper.
Dark Mode & Dynamic Color is a free Jetpack Compose Academy lesson on CoddyKit — lesson 3 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Jetpack Compose Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
Two Palettes, One App
A polished app ships both a light and a dark palette. You define them as separate colorScheme objects and switch between them at the theme level. 🌙
Detect the System Setting
You ask the system which mode is active with isSystemInDarkTheme, a Composable that returns true when the user prefers dark.
val dark = isSystemInDarkTheme()Pick the Scheme
With that flag you choose which palette to pass into MaterialTheme, so the app follows the system dark mode setting automatically.
val scheme = if (dark) darkColorScheme()
else lightColorScheme()darkColorScheme Defaults
The darkColorScheme builder ships sensible low-light defaults, so even before customizing you get readable, comfortable dark surfaces.
Contrast Still Matters
In dark mode you keep the same color roles, but tune surfaces darker and on-colors lighter so text stays easy to read.
What Is Dynamic Color
Dynamic color is Material You magic: on Android 12 and up the system can derive your palette from the user's wallpaper. 🎨
Check the Android Version
Dynamic color needs API 31 or higher, so you gate it with a version check before reaching for the wallpaper-based scheme.
val supported = Build.VERSION.SDK_INT >= 31Build a Dynamic Scheme
When supported, you call dynamicLightColorScheme or its dark variant with a context to pull colors straight from the wallpaper.
dynamicDarkColorScheme(context)Always Have a Fallback
On older devices dynamic color is unavailable, so you fall back to your hand-crafted colorScheme to keep branding intact.
Wire It Together
Your theme picks dynamic when allowed, else dark or light by system setting, so one colorScheme choice handles every case.
val scheme = when {
dynamicOk && dark -> dynamicDarkColorScheme(ctx)
dark -> darkColorScheme()
else -> lightColorScheme()
}Test Both Modes
Preview your screens in light and dark, and on a colorful wallpaper, so dynamic color never surprises you with unreadable combos. ✨
Quick Check
A user on Android 13 sets a purple wallpaper. What can your theme do?
Recap: Adaptive, Personal Color
You detected the system mode with isSystemInDarkTheme, swapped palettes, and layered dynamic color with a safe fallback. 🎉
Frequently asked questions
Is the “Dark Mode & Dynamic Color” lesson free?
Yes — the full text of “Dark Mode & Dynamic Color” is free to read here on the web, and the Jetpack Compose Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Jetpack Compose Academy course, upgrade to CoddyKit PRO.
What will I learn in “Dark Mode & Dynamic Color”?
Adapt colors to system and wallpaper. You practise Jetpack Compose Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Jetpack Compose Academy?
No prior experience is required. Jetpack Compose Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 3 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “Dark Mode & Dynamic Color” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Jetpack Compose Academy lesson?
Yes. Every Jetpack Compose Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- MaterialTheme & Color Schemes
- Typography & Shape Tokens
- Dark Mode & Dynamic Color
- Building a Custom Design System