Motion · Learn · Guide

Three levels, in increasing order of regret

Material describes three ways to apply motion. Each one buys more control and costs more maintenance, so the honest default is to stop at the first level that solves the problem. All three are applied in Customize — this guide explains what each one means.

Level 1

Use a default motion scheme

The two schemes should be sufficient for almost everything. Standard resolves motion with minimal bounce; Expressive overshoots for physical character. Pick one and every component follows it — and every value Etesie emits is Material's published web conversion, unchanged.

Level 2

Create a custom scheme

Fork individual springs from a base scheme by giving them explicit physics. The fork is per spring: anything you set leaves Material's published curve behind, so that spring's web values become sampled rather than official — while every untouched spring keeps the official numbers. Editing a value back to the inherited one un-forks the spring; a custom scheme is exactly the springs you actually changed.

Two guardrails: damping accepts 0.4–1 and stiffness 80–2000, and an effects spring below damping 1 gets a warning — Material keeps color and opacity critically damped because an opacity of 1.08 does not exist.

Level 3

Swap the scheme per element

Run most of the product on one scheme and give a few elements the other — an expressive FAB in an otherwise standard product. The assignment does not change; only which scheme it resolves against.

A swapped component points at --et-motion-scheme-{scheme}-* instead of the product-level alias. Both named namespaces always exist — Material keeps the scheme out of the token name precisely so one element can swap without re-pointing any assignment — which is what makes the swap a one-line change.