Start with a reusable Base design, then override only what needs to change for a particular device shape.
Create a device profile#
- Finish Desktop - Base first.
- Select a profile, or use + Portrait profile, + Landscape profile or + Mobile 2400x1080.
- Set a descriptive Name, Reference Resolution and aspect range. Aspect is width divided by height: 2400 / 1080 is approximately 2.22.
- Choose an element and Edit element, or return to Designer with that profile selected.
- Change only the fields that should differ. Save and compare against Base.
| Control | Effect |
|---|---|
| Remove override | Remove one element's profile patch and restore inherited values. |
| Reset profile overrides | Return the profile's patches to inherited/base settings. |
| Delete selected device | Remove the selected profile and overrides after confirmation. Base cannot be deleted. |
Read the profile inspector#
| Screenshot value | Interpretation |
|---|---|
| 2400 × 1080 | Authoring reference space, not guaranteed physical pixels on every device. |
| Minimum 2.15 / Maximum 2.3 | Match this landscape aspect band. |
| 12 local overrides | Twelve elements have profile-specific patches. |
| Top contrast: 5 changed settings | Five overridden fields, not five additional layers. |
| Edit element | Open that element's values in the selected profile. |
Define deliberate portrait, tablet and ultrawide ranges. Avoid ambiguous overlap. Inspect safe areas, anchors, readable inset spacing and long titles on actual target aspect ratios.
Runtime selection: a request chooses its profile when it starts. Rotating the device during that request does not select another profile.
Verify inheritance#
Change a title in the phone profile, return to Base and verify the original remains. Preview a narrow phone and a wide screen, not only the reference canvas. Confirm a bottom-anchored progress row stays near the bottom with readable margins.