Material components in Compose

Jetpack Compose offers an implementation of Material Design, a comprehensive design system for creating digital interfaces. You can use composable functions to implement Material components.

Actions

Buttons

Buttons prompt most actions in a UI.

Floating action button

Floating actions buttons (FABs) help users take primary actions.

Icon button

Icon buttons help users take minor actions with one tap.

Segmented button

Segmented buttons help users select options, switch views, or sort elements.

Communication

Badges

Badges show notifications, counts, or status information on navigation items and icons.

Progress indicators

Progress indicators express an unspecified wait time or display the duration of a process.

Snackbar

Snackbars show short updates about app processes at the bottom of the screen.

Tooltips

Tooltips display brief labels or messages.

Containment

Bottom sheets

Bottom sheets show secondary content anchored to the bottom of the screen.

Cards

Cards display content and actions about a single subject.
Carousels show a collection of items that can be scrolled on and off the screen.

Dialogs

Dialogs provide important prompts in a user flow.

Dividers

Dividers are thin lines that group content in lists or other containers.

Lists

Lists are continuous, vertical indexes of text and images.

Scaffold

Scaffolds hold together different parts of the UI in complex user interfaces.

App bars

App bars are placed at the top of a screen to help users navigate.
Navigation bars let people switch between UI views on smaller devices.
Navigation drawers let people switch between UI views on larger devices.
Navigation rails let people switch between UI views on mid-size devices.

Tabs

Tabs organize content across different screens and views.

Selection

Checkbox

Checkboxes let users select one or more items from a list, or turn an item on or off.

Chips

Chips help people enter information, make selections, filter content, or trigger actions.

Date picker

Date pickers let people select a date, or a range of dates.
Menus display a list of choices on a temporary surface.

Radio button

Radio buttons let people select one option from a set of options.

Sliders

Sliders let users make selectios from a range of values.

Switch

Switches toggle the selection of an item on or off.

Time pickers

Time pickers help users select and set a specific time.

Text inputs

Search lets users enter a keyword or phrase to get relevant information.

Text fields

Text fields let users enter text into a UI.

Lists and grids

Learn how to use basic layouts in Compose.

Resources

Learn how to manage resources such as strings and images.

Content and code samples on this page are subject to the licenses described in the Content License. Java and OpenJDK are trademarks or registered trademarks of Oracle and/or its affiliates.

Last updated 2025年07月11日 UTC.