Foundations

Start with the decisions.

Understand how the system works, then use its tokens and guidance to shape your interface.

Select a brand and scheme, and customise pattern tokens.

Implementation expectations for accessible components, docs, and validation.

The layered token architecture that connects Figma to code.

Writing guidelines for labels, messages, and in-product copy.

RTL support, locale considerations, and bi-directional layout.