Material has varying x & y dimensions (measured in dp) and a uniform thickness (1dp). You can, and should, show 3D-ness without adding thickness to elements.

Dimensions

RULE: The opacity and spread of an object’s shadow indicate how close or far it is from the surface underneath.
DONT: express shadows without changing surface elevation (ex: using only color change, rather than color and height change)

Shadows show elevation

RULE: No matter how close you zoom in, it is remains clear without any pixilation.

Infinite Resolution

RULE: Adding content does not add thickness to the element (the element remains at 1dp thickness).


Content

There are 4 main rules regarding physical properties.

Physical properties

Material CAN:
- Change shape
- Change opacity (can be uniform across the entire surface, or can change opacity across a portion of the surface)
- Grow or shrink along its plane
- Join together to become a single surface
- Split, and become whole again

Material CANNOT:
- Bend or fold in ways that exceed the depth of the UI


Transformation

Materials CAN:
- Spontaneously generate or be dismissed anywhere in the environment
- Move along any axis
- Have coordinated motion

*material that exhibits z-axis motion is usually in response to user interaction*


Movement

Measurements

A divider is a line used to separate content, such as in lists or layouts. Its purpose is to create a clear visual distinction between different groups of information, which helps to organize the interface and makes it easier for users to process the content.

Divider

Material surfaces have consistent, unchangeable characteristics and behaviors across Material Design.

University of Michigan - Ann Arbor

Material Design has three-dimensional qualities that are reflected in its use of surfaces, depth, and shadows.

Surfaces

Material Design Documentation

Properties

Material surfaces have a default state of opaque white, with 1dp thickness, and casts a shadow. Every attribute is an alteration of this state.

Learn Before

Related

Learn After