Jetpack Compose makes it easy to implement a design system and give your app a consistent look and feel with theming, components, and more.
The following pages provide details on how to design and implement your design system:
- Material Design 3: Learn how to implement Material You with Compose's implementation of Material Design 3.
- Migrating from Material 2 to Material 3: Learn how to migrate your app from Material Design 2 to Material Design 3 in Compose.
- Custom design systems: Learn how to implement a custom design system in Compose, and how to adapt existing Material Design composables to handle this.
- Anatomy of a theme: Learn about the lower-level constructs and APIs used
by
MaterialTheme
and custom design systems. - Migrating XML themes to Compose: Learn how to migrate your View-based XML themes to Compose.
Samples
The following samples demonstrate design systems in Jetpack Compose:
Jetcaster is a sample podcast app, built with Jetpack Compose. The goal of the sample is to showcase building with Compose across multiple form factors (mobile, TV, and Wear) and full featured architecture.
To try out this sample app, use the latest Jetnews is a sample news reading app, built with Jetpack Compose. The goal of the sample is to showcase the current UI capabilities of Compose.
To try out this sample app, use the latest stable version of Android Studio. You can clone this repository Jetsnack is a sample snack ordering app built with Jetpack Compose.
To try out this sample app, use the latest stable version of Android Studio. You can clone this repository or import the project from Android Studio following the steps here.
This Jetchat is a sample chat app built with Jetpack Compose.
To try out this sample app, use the latest stable version of Android Studio. You can clone this repository or import the project from Android Studio following the steps here.
This sample Learn how this app was designed and built in the design case study, architecture learning journey and modularization learning journey.
This is the repository for the Now in Android app. It is a work in progress 🚧.
Now in Android is a fully functionalJetcaster sample 🎙️
Jetnews sample
Jetsnack sample
Jetchat sample
Now in Android App
Recommended for you
Material Design 2 in Compose
Jetpack Compose is Android's recommended modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.
Custom design systems in Compose
Jetpack Compose is Android's recommended modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.
Anatomy of a theme in Compose
Jetpack Compose is Android's recommended modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.