After the Agent builds your layout, select something on the canvas to open its controls in the Design panel. Use the panel for precise changes to the current selection; use the Agent when you want to add content, change structure, or revise the wider visual direction.
This Design panel is different from the one used with Build from scratch. It does not have separate Style, Interactions, and Settings tabs. The controls below apply to layouts built with the Agent.
Start from the canvas
Open the layout on the canvas.
Click the text, image, link, section, or other part you want to change.
Review the sections shown in the Design panel.
Change a value and review the result on the canvas.
The available sections depend on what you select and how that part of the layout was built. A control that does not apply to the selection is not shown.
Change content
The panel can show content-specific sections above the styling controls:
Image — Replace the selected image with an Instant asset or a Shopify file.
Link — Change the URL and choose whether it opens in a New tab.
App block — Show all app blocks or one app block from the Shopify theme editor.
Cart state — Change the state shown while previewing a cart.
Preset — Change the preset used by a section.
You can also edit supported text directly on the canvas. Ask the Agent when content is generated dynamically and cannot be changed directly.
Adjust size
Use Size to control:
Width and Height
Min width, Max width, Min height, and Max height
Ratio
Overflow
Some controls are already visible because the selected part uses them. Use the + on a section to add another available control.
Arrange content
When the selected part supports the visual layout controls, use Layout to change:
Direction
Gap
Justify
Align
Wrap
The Layout section is not shown for every selection. Ask the Agent when you need to change a structure that the panel does not expose.
Change spacing
Use Spacing to adjust Padding inside the selection and Margin around it. You can change all sides together or set individual sides.
Style text
Use Typography for the text controls available on the selection:
Font size and Color
Spacing, including line height and letter spacing
Align
Case and Accent
Overflow, Wrap, and Break
Use your brand kit to guide the typography the Agent creates. Ask the Agent when you want to change a typeface or apply a broader typography direction.
Change appearance
Use the remaining sections for visual adjustments:
Style — Radius, Shadow, Opacity, Scale, and Rotate
Background — Color and Position
Border — Color, Width, and Style
Background → Position controls how a background image is aligned. It does not move the selected content around the layout. If you want to reposition content, use Layout, Spacing, or ask the Agent.
Make responsive changes
The screen size selected above the canvas determines which responsive value you view and change. Switch to desktop, laptop, tablet, or mobile first, then adjust the selection in the panel.
Review the result on the canvas after each change. A value inherited from a larger screen size remains in effect until you change it at a smaller one.
When to use the Agent
Return to the Agent when you want to:
Add, remove, replace, or reorder a section
Change the overall structure or visual direction
Apply your brand kit
Change something that is not available for the current selection
Select a specific part on the canvas before asking for a focused change, or clear the selection for a layout-wide request.