Material Design 3 Components

Overview

This skill provides a comprehensive reference for all Material Design 3 (M3) components — covering the full specification from Material You foundations through M3 Expressive enhancements. Each component follows M3's token-based design system for color, shape, typography, motion, and layout.

Keywords: Material Design 3, M3, components, buttons, cards, dialogs, navigation, FAB, chips, text fields, tabs, menus, snackbar, bottom sheet, Material You, M3 Expressive

Component Categories

M3 components are organized into six categories:

1. Action — Buttons, FABs, icon buttons, segmented buttons, split buttons, button groups
2. Containment — Cards, carousels, dividers, lists, bottom sheets, side sheets
3. Communication — Badges, dialogs, progress indicators, snackbars, tooltips
4. Navigation — App bars, navigation bar, navigation drawer, navigation rail, tabs, search
5. Selection — Checkboxes, chips, date/time pickers, menus, radio buttons, sliders, switches
6. Text Input — Text fields (filled, outlined)