What's new

Learn about new guidelines, components, tools, and announcements across platforms


Guidelines

New guidance and updated best practices for designing Material products

2019

June

May

April

February

2018

December

October

  • Updated guidance about differences in bottom navigation behavior between Android and iOS
  • Learn how to use Expanding bottom sheet to display selection queues, chat features, and other content in a small persistent container

May

  • Launched Material Theming – the ability to systematically customize Material Design to better reflect your product’s brand
  • Added Material studies to showcase the flexibility of Material Theming and components to create expressive and unique apps

2017

September

April

2016

December

  • Platforms discusses when and how to adapt apps to Material Design, and when to adhere to platform conventions
  • App shortcut icons contains specs on how to create app shortcut icons for the home screen
  • Help and feedback describes how to indicate, craft, and place help content
  • Bidirectionality has updated guidance on mirroring UI content and icons in right-to-left (RTL) languages
  • Accessibility contains new guidance on sound, controls, labeling elements, and testing
  • Selection includes detailed examples on item selection, toggling, and styling

August

  • Notifications have been revised for Android N, including new content areas, interactions, user controls, and short text input
  • Widgets contains guidance on user engagement, retention, and acquisition
  • Confirmation and acknowledgement covers when and how to acknowledge user actions
  • Navigation now includes details on how to use the Up and Back buttons as part of your navigation strategy
  • Using full-screen mode for Lean Back, Immersive mode, and Lights out interactions

May

  • Motion includes detailed examples and specs on material motion principles, duration and easing, transformations, choreography, and customization
  • Growth & communications contains guidance on user engagement, retention, and acquisition
  • Expansion panels guidance describes lightweight containers used for creating flows and editing content

March

February

2015

December

  • Responsive UI includes a pattern on positioning and more examples of responsive patterns
  • Text fields adds guidance on required text fields
  • Whiteframes have been added for Sketch
  • Punctuation has new guidance on en dashes and parentheses

October

  • Steppers describes how different types of steppers convey progress through numbered steps
  • Chips adds guidance on chip movement and deletion
  • Notifications includes formatting guidance for timestamps

September

  • Navigation adds guidance on navigation hierarchy and structure, new navigation patterns, and combined navigation patterns
  • UI color application describes how transparent text maintains legibility against different background colors
  • Buttons contains guidance on toggle buttons and flat button behaviors
  • Tabs includes guidance on text sizing in tabs

August

  • Permissions contains guidance on permissions groups, runtime permissions, request patterns, and how to address permissions when they are denied
  • Bottom sheets includes descriptions of persistent and modal bottom sheets, alternative display options, and desktop and tablet display using increments
  • Settings includes a usage overview

July

  • Notifications contains guidance for tailoring notifications to users, including peeking notifications
  • Fingerprint contains guidance on implementing Fingerprint as an authentication option
  • Cards includes more image examples of card UI controls, sliders, and tabs
  • Launch screens includes guidance for implementing placeholder UIs
  • Settings includes additional guidance for labels and secondary text

May

April

  • Typography adds further guidance on style and line height for dense and tall languages
  • Cards includes more specs for laying out actions and content
  • Dialogs contains additional layout guidance
  • Tabs adds guidance around label content and more complete sizing specs
  • Scrolling techniques adds guidance for overlapping content

Components

New code and documentation for Material Components

2019

May

April

  • New beta component for iOS, BannerView displays a prominent message and related actions.

March

February

  • Card behavior updated to align with guidance across all platforms
  • Flutter added a new Demo app based on the Material Study Fortnightly – showcasing Material Theming, custom typography, and text-heavy UI design and layout
  • MDC Android added the Extended FAB – a new Floating Action Button component capable of containing text
  • MDC iOS improved the behavior, appearance, and state support of the visual ripple
  • MDC Web updated the Text Field component to enable the display of character count, as well as a text field variant without a built-in label
  • MDC Web updated the snackbar component to improve behavior and appearance

2018

October

  • New MDC Web component catalog featuring interactive demos and handy links to documentation, code, and design guidelines.
  • MDC Web launched Select menus, a new text field component helping users select from a list of options.
  • MDC Flutter launched Expanding bottom sheet, a flexible component for accessing features like selection queues, chat, and other content.
  • Update to Flutter code for improved Material Theming.
  • MDC Flutter launched Backdrop, a new component appearing behind other surfaces in an app, displaying contextual and actionable content.

September

  • MDC Web updated the size and layout of Dialogs to automatically adjust to the amount of content and screen space.

August

  • New MDFInternationalization API for iOS makes it easier to support RTL languages and bi-directional text.
  • New Navigation drawer component for iOS provides access to destinations in your app.
  • MDC Web added new implementations of Navigation drawer, including permanent, dismissible, and modal navigation drawers.
  • MDC iOS launches new Action sheet component that applies Material principles to the standard iOS notification pattern.
  • MDC Web updated Menus to have more flexibility in positioning, as well as support for menu item icons and selection groups.

July

  • MDC Android updated component typography to enable typography theming in all Android components – including buttons, tabs, and menus.
  • MDC Web updated Tabs to make them more performant and support theming with color and typography.

June

  • MDC Android updated component typography to enable typography theming in all Android components – including buttons, tabs, and menus.
  • MDC Web updated Tabs to make them more performant and support theming with color and typography.
  • Learn how to get started and configure create-react-app to use Material Components.
  • MDC iOS added VoiceOver support for auditory descriptions of onscreen elements including app bars, sliders, and text fields.
  • MDC Flutter Improved accessibility support for selection controls including checkboxes, radio buttons, and switches.
  • MDC iOS

May


Tools

New tools and downloadable resources

2019

May

February

  • New Motion sticker sheet for designing UI motion in After Effects – containing Material components, baseline UIs, and navigation transitions.

2018

September

May

  • Launched Material Theme Editor – a Sketch plugin for creating your own branded symbol library and apply global style changes to color, shape, and typography
  • Launched Gallery, a collaborative tool for uploading design work, getting feedback, and tracking revisions
  • Launched four new downloadable icon sets

Announcements

News and announcements about Material Design

2019

June

May

April

March

February

2018

December

November

  • On Google Design: The 2018 Material Design Awards honor teams at KptnCook, Lyft, Simple Habit Meditation, and Anchor for using Material to make expressive, effective apps
  • On Medium: How to use Material’s shape system to enhance brand expression, direct attention, and reinforce interactions

June

May