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

October

July

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

October

September

July

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

August

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

October

September

August

July

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