Skip to content
Magma Design System
Building blocks
The building blocks are being written, together with the first patterns they come from.How to contribute Between a component and a whole screen there is a middle size. A building block is a group of Magma components that screens use again and again, in the same arrangement: the header of a page with its title and its actions, a bar of filters, the summary of the results, a section of a form, a bar of actions, an empty or an error state, a dialog that asks for confirmation. A building block holds no data and no business logic. Its rules are about structure and layout: which parts it has and which of them are optional, in which order they come, how it adapts to the width of the screen.
Components, blocks, patterns
A component is one Magma element, such as a button or a field: Magma ships it ready.A building block puts components together into a part of a screen.A pattern is a whole screen or task: building blocks, plus what happens over time - where the state lives, what follows an action, loading, errors, focus.
Where they come from
The building blocks are not designed in advance: they come out of the patterns. A part of a screen becomes a block when it comes back in two or three patterns, so that it is written once and every screen that needs it builds it the same way. Each block will have its page: its parts, the rules that always hold, its states, the components it is made of and its code.
Modified 5 days agoVittorio VittoriDesign System Architect
Created 5 days agoVittorio VittoriDesign System Architect