The attribute panels are where you view & adjust the settings for an object or page. You can use the attribute panels to modify the object’s element-specific properties, layout, position, and appearance.
Where are the Attribute Panels?
In macOS, the attribute panels are always visible on the right side of the app.
In iOS, the attribute panels pop up from the bottom of the screen like a modal whenever you have an object or page selected. Similarly to a modal, you can drag up and down to adjust the attribute panels’ height.
Editing the Element Settings
The Element Settings Panel has properties that are specific to the selected element’s type. Each element’s Element Settings will be different.
Each element’s properties are 1:1 with the SwiftUI properties that an engineer will use to code your design, removing a lot of the guesswork during your handoff process.
Learn more about each element’s settings by reading the element articles.
Editing an Object’s Layout
The Layout Panel has properties related to an object’s size. These properties include the object’s height, width, scale, padding, and margin.
Editing an Object’s Position
The Position Panel has properties related to an object’s position. These properties include the object’s offset X & Y, depth, and absolute positioning, called Pinned To in Play.
Editing an Object’s Appearance
The Appearance Panel has all the properties related to an object’s visual appearance. These properties include the object’s background color, corner radius, opacity, blend modes, and compositing.
Materials, shadows, and borders are also under styles.