Skip to main content

Feature preview: Customer account improvements

Customer accounts are getting design updates to improve navigation, layout, visual design, consistency across devices, visibility of UI extensions, and more. Use this early preview to test your customer account UI extensions in the updated design.

These improvements create a more polished, consistent experience for customer accounts, and a stronger foundation for the UI extensions you build on top of them. The new single-column layout paired with responsive values means your UI extensions will render more predictably across screen sizes. More visible order action and order summary extensions also mean the features you build will be easier for customers to discover and use.

These changes don't break your existing work. All current extension targets remain supported, but testing now will ensure your extensions will continue to look as intended when these design updates are released to merchants. What you'll see is a work-in-progress version. We'll keep making improvements throughout the preview, so your feedback directly shapes what merchants get at GA.

Anchor to What's changingWhat's changing

  • Native page layouts are now single-column by default. Full-page extensions will default to full width, but you can choose to apply the narrower width.
  • Existing extension targets are mapped to the new layout. See extension targets by page for more information.
  • Layout is simplified and consistent across desktop and mobile.
  • Navigation is visible on desktop and mobile.
  • More order action UI extensions are displayed inline.
  • Order summary UI extensions are displayed inline, not collapsed on mobile.
  • Avatar image is consistent with the account component.

Anchor to Prepare your extensions for the new layoutPrepare your extensions for the new layout

Anchor to Enable the feature previewEnable the feature preview

Get early access to the changes by enabling the Customer account improvements feature preview on a development store.

Caution

Feature previews are still under development and are subject to change.

Anchor to Update to API version 2025-10 or laterUpdate to API version 2025-10 or later

If your extension uses API version 2025-07 or earlier, you should consider updating to 2025-10 or later to adopt Polaris web components.

If your extension uses API version 2025-10 or later, wrap any inline UI extensions that render on native pages in <s-query-container> and use responsive values so the content automatically adjusts to different screen sizes.

Anchor to Test your UI extensionsTest your UI extensions

Test your UI extensions —especially full-page extensions— in the context of the updated design.

Anchor to Apply the narrow page width (optional)Apply the narrow page width (optional)

To apply the narrow page width to your full-page extension, wrap your extension in the following code, depending on what API version you're using:

2026-07 or later:

In this API version, full page extensions built with the Page component default to the narrow width automatically. Should you require the additional space on desktop, set inlineSize="large" on the Page.

2025-10 to 2026-04:

jsx

<s-grid gridTemplateColumns="minmax(auto, 64rem)" justifyContent="center">
{/* full page extension */}
</s-grid>

2025-07 or earlier:

jsx

<Grid columns={Style.default(['fill']).when({viewportInlineSize: {min: 'small'}}, ['fill', 640, 'fill'])}>
<View display={Style.default('none').when({viewportInlineSize: {min: 'small'}}, 'auto')} />
{/* full page extension */}
<View display={Style.default('none').when({viewportInlineSize: {min: 'small'}}, 'auto')} />
</Grid>

Anchor to Extension targets by pageExtension targets by page

See where the existing customer account extension targets will be rendered in the new layout.

Anchor to Full-page extension (Default width)Full-page extension (Default width)

Diagram of customer accounts showing where full-page extension targets render on the page, using the default width.

Anchor to Full-page extension (Narrow width)Full-page extension (Narrow width)

Adapt your full-page extension to use the narrow width by following these instructions.

Diagram of customer accounts showing where full-page extension targets render on the page, using the narrow width.

Anchor to Order indexOrder index

Diagram of the Order index page in customer accounts, showing where extension targets render on the page.

Anchor to Order statusOrder status

Diagram of the Order status page in customer accounts, showing where extension targets render on the page.

Anchor to Profile (Default)Profile (Default)

Diagram of the default Profile page in customer accounts, showing where extension targets render on the page.

Anchor to Profile (B2B)Profile (B2B)

Diagram of the Profile page for B2B customers, showing where extension targets render on the page.
Was this page helpful?